https://www.chesterzoo.org/_next/static/chunks/4514.84504bdc60aebd2d.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[4514,6131,3763],{74514:function(e,t,a){"use strict";a.r(t),a.d(t,{Carousel:function(){return i},Default:function(){return n}});let s={title:"Components/Quiz Tile Section",component:a(16611).default,parameters:{layout:"fullscreen",backgrounds:{default:"dark"}}};t.default=s;let n={args:{heading:{heading:"Zebra quiz",headingLevel:"h2",headingCategory:{name:"Parent Tag",link:{path:"/",title:"Parent Tag",target:"_self"}},showTag:!0},text:{markup:"<p>Challenge your knowledge and flip the cards to know the answers. And if you are still learning flip all the cards in one go by clicking on the button below.</p>"},quizCards:[{icon:{url:"/media/qcfpt5zz/illustrated-mammal.png",name:"Illustrated Mammal",width:400,height:400,altText:"Illustrated Mammal"},strap:"Species",heading:"I'm a mammal!",text:{markup:"Lorem ipsum dolor sit amet consectetur. Montes quis et maecenas fringilla dui. At enim suspendisse metus sed."},theme:"pink"},{icon:{url:"/media/ys2jq0su/illustrated-found-in.png",name:"Illustrated Found In",width:400,height:400,altText:"Illustrated Found In"},strap:"Found in",heading:"Southern Africa",text:{markup:"Lorem ipsum dolor sit amet consectetur. Montes quis et maecenas fringilla dui. At enim suspendisse metus sed."},theme:"blue"},{icon:{url:"/media/nbmpuprt/illustrated-habitat.png",name:"Illustrated Habitat",width:400,height:400,altText:"Illustrated Habitat"},strap:"Habitat",heading:"Nushy savannahs of Africa",text:{markup:"Lorem ipsum dolor sit amet consectetur. Montes quis et maecenas fringilla dui. At enim suspendisse metus sed."},theme:"orange"},{icon:{url:"/media/oeljmoh5/illustrated-diet.png",name:"Illustrated Diet",width:400,height:400,altText:"Illustrated Diet"},strap:"Diet",heading:"Herbivorous (plants only)",text:{markup:"Lorem ipsum dolor sit amet consectetur. Montes quis et maecenas fringilla dui. At enim suspendisse metus sed."},theme:"green"},{icon:{url:"/media/wzphry05/illustrated-behaviour.png",name:"Illustrated Behaviour",width:400,height:400,altText:"Illustrated Behaviour"},strap:"Behaviour",heading:"Crepuscular (active at dawn and dusk)",text:{markup:"Lorem ipsum dolor sit amet consectetur. Montes quis et maecenas fringilla dui. At enim suspendisse metus sed."},theme:"yellow"},{icon:{url:"/media/unmd5j1a/illustrated-size.png",name:"Illustrated Size",width:400,height:400,altText:"Illustrated Size"},strap:"Average size",heading:"4.8 - 5.4m",text:{markup:"Lorem ipsum dolor sit amet consectetur. Montes quis et maecenas fringilla dui. At enim suspendisse metus sed."},theme:"green"},{icon:{url:"/media/igpj5seq/illustrated-life-span.png",name:"Illustrated Life Span",width:400,height:400,altText:"Illustrated Life Span"},strap:"Life span",heading:"20 - 30 years",text:{markup:"Lorem ipsum dolor sit amet consectetur. Montes quis et maecenas fringilla dui. At enim suspendisse metus sed."},theme:"pink"},{icon:{url:"/media/fkobz2w1/illustrated-zoo-location.png",name:"Illustrated Zoo Location",width:400,height:400,altText:"Illustrated Zoo Location"},strap:"Zoo location",heading:"X Zone",text:{markup:"Lorem ipsum dolor sit amet consectetur. Montes quis et maecenas fringilla dui. At enim suspendisse metus sed."},theme:"blue"}],displayAsCarousel:!1}},i={args:{heading:{heading:"Did you know?",headingLevel:"h2",showTag:!1},quizCards:[{icon:{url:"/media/qcfpt5zz/illustrated-mammal.png",name:"Illustrated Mammal",width:400,height:400,altText:"Illustrated Mammal"},strap:"Fun fact",heading:"Lorem ipsum dolor sit amet consectetur. Montes quis et maecenas fringilla dui. At enim suspendisse metus sed.",theme:"pink"},{icon:{url:"/media/qcfpt5zz/illustrated-mammal.png",name:"Illustrated Mammal",width:400,height:400,altText:"Illustrated Mammal"},strap:"Fun fact",heading:"Lorem ipsum dolor sit amet consectetur. Montes quis et maecenas fringilla dui. At enim suspendisse metus sed.",theme:"blue"},{icon:{url:"/media/qcfpt5zz/illustrated-mammal.png",name:"Illustrated Mammal",width:400,height:400,altText:"Illustrated Mammal"},strap:"Fun fact",heading:"Lorem ipsum dolor sit amet consectetur. Montes quis et maecenas fringilla dui. At enim suspendisse metus sed.",theme:"orange"},{icon:{url:"/media/qcfpt5zz/illustrated-mammal.png",name:"Illustrated Mammal",width:400,height:400,altText:"Illustrated Mammal"},strap:"Fun fact",heading:"Lorem ipsum dolor sit amet consectetur. Montes quis et maecenas fringilla dui. At enim suspendisse metus sed.",theme:"green"},{icon:{url:"/media/qcfpt5zz/illustrated-mammal.png",name:"Illustrated Mammal",width:400,height:400,altText:"Illustrated Mammal"},strap:"Fun fact",heading:"Lorem ipsum dolor sit amet consectetur. Montes quis et maecenas fringilla dui. At enim suspendisse metus sed.",theme:"yellow"},{icon:{url:"/media/qcfpt5zz/illustrated-mammal.png",name:"Illustrated Mammal",width:400,height:400,altText:"Illustrated Mammal"},strap:"Fun fact",heading:"Lorem ipsum dolor sit amet consectetur. Montes quis et maecenas fringilla dui. At enim suspendisse metus sed.",theme:"green"},{icon:{url:"/media/qcfpt5zz/illustrated-mammal.png",name:"Illustrated Mammal",width:400,height:400,altText:"Illustrated Mammal"},strap:"Fun fact",heading:"Lorem ipsum dolor sit amet consectetur. Montes quis et maecenas fringilla dui. At enim suspendisse metus sed.",theme:"pink"},{icon:{url:"/media/qcfpt5zz/illustrated-mammal.png",name:"Illustrated Mammal",width:400,height:400,altText:"Illustrated Mammal"},strap:"Fun fact",heading:"Lorem ipsum dolor sit amet consectetur. Montes quis et maecenas fringilla dui. At enim suspendisse metus sed.",theme:"blue"}],displayAsCarousel:!0}}},16611:function(e,t,a){"use strict";a.r(t),a.d(t,{default:function(){return d}});var s=a(57437),n=a(44839),i=a(37776);function l(e){let{icon:t,strap:a,heading:n,text:i,theme:l="pink"}=e;return(0,s.jsx)("div",{className:"card-quiz card-quiz--".concat(l.toLowerCase()," rounded-2xl lg:rou

1nded-3xl w-full"),children:(0,s.jsxs)("div",{className:"aspect-[7/9] md:aspect-[11/16] lg:aspect-[29/31] xl:aspect-[7/9] flex flex-col md:w-full p-6 text-center",children:[t&&(0,s.jsx)("div",{className:"flex justify-center grow",children:(0,s.jsx)("div",{className:"card-quiz__icon w-[100px] h-[100px]",style:{maskImage:"url('".concat(t.url,"?width=200')")}})}),(0,s.jsx)("div",{className:"font-czoo-sharp-grotesk text-sm leading-none uppercase mb-2",children:a}),(0,s.jsx)("div",{className:"font-czoo-sharp-grotesk heading-5",children:n}),i&&(0,s.jsx)("div",{className:"rte body-sm pt-2",dangerouslySetInnerHTML:{__html:i.markup}})]})})}a(9002);var r=a(83015),o=a(54477);a(83763);var u=a(1921);function d(e){var t;let{heading:a,text:d,quizCards:m,displayAsCarousel:c=!1}=e;return(0,s.jsx)(u.Z,{className:(0,n.Z)("quiz-tile-section",!c&&"quiz-tile-section--grid",c&&"quiz-tile-section--carousel","overflow-hidden"),headingExcluded:!(null==a?void 0:a.heading),children:(0,s.jsxs)("div",{className:"container",children:[(null==a?void 0:a.headingCategory)&&a.showTag&&!c&&(0,s.jsx)("div",{className:"flex justify-center mb-2 lg:mb-4",children:(0,s.jsx)(r.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,s.jsxs)("header",{className:(0,n.Z)("quiz-tile-section__header mb-10",!c&&"text-center"),children:[(0,s.jsx)(o.Z,{level:null==a?void 0:a.headingLevel,size:"heading-2",margin:c?"mb-10 lg:mb-6":"mb-3 lg:mb-4",children:a.heading}),d&&!c&&(0,s.jsx)("div",{className:"rte body-base text-balance",dangerouslySetInnerHTML:{__html:d.markup}})]}),(0,s.jsx)(i.EmblaCarousel,{dotButtons:!0,arrowButtons:c,options:{align:"center",loop:!0,slidesToScroll:1,breakpoints:c?{"(min-width: 768px)":{align:"start",loop:!1}}:{"(min-width: 768px)":{active:!1}}},children:m.map((e,t)=>(0,s.jsx)(i.EmblaCarouselSlide,{children:(0,s.jsx)(l,{icon:e.icon,strap:e.strap,heading:e.heading,text:e.text,theme:e.theme})},t))})]})})}},37776:function(e,t,a){"use strict";a.r(t),a.d(t,{EmblaCarousel:function(){return p},EmblaCarouselSlide:function(){return h}});var s=a(57437),n=a(2265),i=a(74300),l=a(19281),r=a(95243),o=a(30286),u=a(44839);let d=e=>{let[t,a]=(0,n.useState)(!0),[s,i]=(0,n.useState)(!0),l=(0,n.useCallback)(()=>{e&&e.scrollPrev()},[e]),r=(0,n.useCallback)(()=>{e&&e.scrollNext()},[e]),o=(0,n.useCallback)(e=>{a(!e.canScrollPrev()),i(!e.canScrollNext())},[]);return(0,n.useEffect)(()=>{e&&(o(e),e.on("reInit",o).on("select",o))},[e,o]),{prevBtnDisabled:t,nextBtnDisabled:s,onPrevButtonClick:l,onNextButtonClick:r}},m=e=>{let{children:t,...a}

1=e,[i,l]=(0,n.useState)(!1);return(0,s.jsxs)("button",{className:(0,u.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",i&&"!bg-primary-accent"),type:"button",onMouseDown:()=>l(!0),onMouseUp:()=>setTimeout(()=>l(!1),150),onMouseLeave:()=>l(!1),...a,children:[(0,s.jsx)("div",{className:"mr-1",children:(0,s.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"15",height:"24",viewBox:"0 0 15 24",children:(0,s.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]})},c=e=>{let{children:t,...a}=e,[i,l]=(0,n.useState)(!1);return(0,s.jsxs)("button",{className:(0,u.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",i&&"!bg-primary-accent"),type:"button",onMouseDown:()=>l(!0),onMouseUp:()=>setTimeout(()=>l(!1),150),onMouseLeave:()=>l(!1),...a,children:[(0,s.jsx)("div",{className:"ml-1",children:(0,s.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"15",height:"24",viewBox:"0 0 15 24",children:(0,s.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 h=(0,n.forwardRef)((e,t)=>(0,s.jsx)("div",{ref:t,className:"embla__slide",...e,children:e.children}));h.displayName="EmblaCarouselSlide";let p=e=>{let{children:t,arrowButtons:a=!1,dotButtons:u=!1,autoScroll:h=null,handleSlideInView:p,onBlur:g,onMouseEnter:f,onArrowButtonClick:x,onPointerDown:v,onPointerUp:b,setApi:w,options:y={}}=e,[j,I]=(0,i.Z)(y,(()=>{let e=[(0,r.Z)()];return h&&e.push((0,l.Z)(h)),e})());(0,n.useEffect)(()=>{I&&w&&w(I)},[I,w]);let{selectedIndex:k,scrollSnaps:L,onDotButtonClick:M}=(0,o.Y)(I),{prevBtnDisabled:z,nextBtnDisabled:N,onPrevButtonClick:_,onNextButtonClick:q}=d(I),C=(0,n.useCallback)(()=>{I&&x&&x(I),_()},[I,x,_]),S=(0,n.useCallback)(()=>{I&&x&&x(I),q()},[I,x,q]),[T,E]=(0,n.useState)(!1),{isIntersecting:A,ref:Z}=function(){var e;let{threshold:t=0,root:a=null,rootMargin:s="0%",freezeOnceVisible:i=!1,initialIsIntersecting:l=!1,onChange:r}=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{}

1,[o,u]=(0,n.useState)(null),[d,m]=(0,n.useState)(()=>({isIntersecting:l,entry:void 0})),c=(0,n.useRef)();c.current=r;let h=(null===(e=d.entry)||void 0===e?void 0:e.isIntersecting)&&i;(0,n.useEffect)(()=>{let e;if(!o||!("IntersectionObserver"in window)||h)return;let n=new IntersectionObserver(t=>{let a=Array.isArray(n.thresholds)?n.thresholds:[n.thresholds];t.forEach(t=>{let s=t.isIntersecting&&a.some(e=>t.intersectionRatio>=e);m({isIntersecting:s,entry:t}),c.current&&c.current(s,t),s&&i&&e&&(e(),e=void 0)})},{threshold:t,root:a,rootMargin:s});return n.observe(o),()=>{n.disconnect()}},[o,JSON.stringify(t),a,s,h,i]);let p=(0,n.useRef)(null);(0,n.useEffect)(()=>{var e;o||null===(e=d.entry)||void 0===e||!e.target||i||h||p.current===d.entry.target||(p.current=d.entry.target,m({isIntersecting:l,entry:void 0}))},[o,d.entry,i,h,l]);let g=[u,!!d.isIntersecting,d.entry];return g.ref=g[0],g.isIntersecting=g[1],g.entry=g[2],g}();return(0,n.useEffect)(()=>{var e;if(!h)return;let t=null==I?void 0:null===(e=I.plugins())||void 0===e?void 0:e.autoScroll;t&&(A?(E(!0),t.play()):(E(!1),t.stop()))},[h,I,A]),(0,n.useEffect)(()=>{var e;let t=null==I?void 0:null===(e=I.plugins())||void 0===e?void 0:e.autoScroll;t&&(E(t.isPlaying()),I.on("autoScroll:play",()=>E(!0)).on("autoScroll:stop",()=>E(!1)).on("reInit",()=>E(t.isPlaying())))},[I]),(0,n.useEffect)(()=>{p&&I&&I.on("slidesInView",()=>{p(I.slidesInView())})},[p,I]),(0,n.useEffect)(()=>{if(!g||!I)return;let e=I.rootNode(),t=()=>g(I),a=t=>{e.contains(t.relatedTarget)||g(I)};return e.addEventListener("mouseleave",t),e.addEventListener("focusout",a),()=>{e.removeEventListener("mouseleave",t),e.removeEventListener("focusout",a)}},[g,I]),(0,n.useEffect)(()=>{if(!f||!I)return;let e=I.rootNode(),t=()=>f(I);return e.addEventListener("mouseenter",t),()=>{e.removeEventListener("mouseenter",t)}},[f,I]),(0,n.useEffect)(()=>{if(!v||!I)return;let e=()=>v(I);return I.on("pointerDown",e),()=>{I.off("pointerDown",e)}},[v,I]),(0,n.useEffect)(()=>{if(!b||!I)return;let e=()=>b(I);return I.on("pointerUp",e),()=>{I.off("pointerUp",e)}},[b,I]),(0,s.jsxs)("div",{className:"embla",ref:Z,children:[(0,s.jsx)("div",{className:"embla__viewport",ref:j,children:(0,s.jsx)("div",{className:"embla__container",children:t})}),(u||a)&&(0,s.jsxs)("div",{className:"embla__controls",children:[a&&(0,s.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,s.jsx)(m,{onClick:C,disabled:z}),(0,s.jsx)(c,{onClick:S,disabled:N})]}),u&&(0,s.jsx)("div",{className:"embla__dots",children:L.map((e,t)=>(0,s.jsx)(o.H,{className:"embla__dot".concat(t===k?" embla__dot--selected":""),onClick:()=>M(t)},t))})]})]})}},30286:function(e,t,a){"use strict";a.d(t,{H:function(){return l},Y:function(){return i}});var s=a(57437),n=a(2265);let i=e=>{let[t,a]=(0,n.useState)(0),[s,i]=(0,n.useState)([]),l=(0,n.useCallback)(t=>{e&&e.scrollTo(t)},[e]),r=(0,n.useCallback)(e=>{i(e.scrollSnapList())},[]),o=(0,n.useCallback)(e=>{a(e.selectedScrollSnap())},[]);return(0,n.useEffect)(()=>{e&&(r(e),o(e),e.on("reInit",r).on("reInit",o).on("select",o))},[e,r,o]),{selectedIndex:t,scrollSnaps:s,onDotButtonClick:l}},l=e=>{let{children:t,...a}=e;return(0,s.jsx)("button",{type:"button",...a,children:t})}},1921:function(e,t,a){"use strict";var s=a(57437),n=a(44839);t.Z=e=>{let{children:t,className:a,headingExcluded:i,style:l,hidePaddingOnMobile:r}=e;return(0,s.jsx)("div",{className:(0,n.Z)("component-section",i&&"heading-excluded",r&&"hide-padding-on-mobile",a),style:l,children:t})}},83015:function(e,t,a){"use strict";a.d(t,{Z:function(){return r}});var s=a(57437),n=a(87138),i=a(44839),l=a(77220);function r(e){let{name:t,link:a,target:r="_self"}=e,o=(0,i.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,s.jsx)(s.Fragment,{children:a?(0,s.jsxs)(n.default,{className:o,href:(0,l.n)(a),target:r,children:[(0,s.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,s.jsx)("span",{className:"parent-tag-text font-czoo-sharp-grotesk text-base leading-4 uppercase tracking-wider",children:t})]}):(0,s.jsx)("div",{className:o,children:(0,s.jsx)("span",{className:"parent-tag-text font-czoo-sharp-grotesk text-base leading-4 uppercase tracking-wider",children:t})})})}a(99033)},83763:function(){},31375:function(){},9002:function(){},99033:function(){}}]);