(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[5975],{93192:function(e,t,r){var s=r(87500),l=r(58260),n=Object.prototype.hasOwnProperty;e.exports=function(e,t,r){var a=e[t];n.call(e,t)&&l(a,r)&&(void 0!==r||t in e)||s(e,t,r)}},57121:function(e,t,r){var s=r(40548),l=r(32619),n=r(24007);e.exports=function(e,t,r){for(var a=-1,i=t.length,o={};++a<i;){var c=t[a],d=s(e,c);r(d,c)&&l(o,n(c,e),d)}return o}},32619:function(e,t,r){var s=r(93192),l=r(24007),n=r(5023),a=r(93702),i=r(86040);e.exports=function(e,t,r,o){if(!a(e))return e;t=l(t,e);for(var c=-1,d=t.length,u=d-1,x=e;null!=x&&++c<d;){var m=i(t[c]),p=r;if("__proto__"===m||"constructor"===m||"prototype"===m)break;if(c!=u){var h=x[m];void 0===(p=o?o(h,m,x):void 0)&&(p=a(h)?h:n(t[c+1])?[]:{})}s(x,m,p),x=x[m]}return e}},98936:function(e,t,r){e.exports=r(95718)},95718:function(e){e.exports=function(e){return e&&e.length?e[0]:void 0}},46849:function(e,t,r){"use strict";r.r(t),r.d(t,{USER_ID_QUERY_PARAM_KEY:function(){return E},__N_SSG:function(){return Z},default:function(){return L}});var s=r(80900);r(5192);var l=r(80762),n=r(59087),a=r.n(n),i=r(25144),o=r.n(i),c=r(4969),d=r(552),u=r(17706),x=r(45549),m=r(14240),p=r(98936),h=r.n(p),f=r(51865),g=r.n(f),j=r(23047),v=r(52872),b=r(85751),y=r(42784),N=r(79633),w=r(54729),k=r(20857),_=r(76509),S=e=>{let{tutorial:t,tutorialBodySerialized:r}=e,{title:n,body:a,ogImage:i,image:o,description:c,testimonials:d}=t,u="".concat(n," Tutorial"),{data:x,status:p}=m.SX.moduleProgress.bySlug.useQuery({slug:t.slug.current});return(0,s.jsxs)(l.Z,{className:"mx-auto w-full pt-12 lg:max-w-screen-lg lg:pb-24",meta:{title:u,description:c,keywords:"typescript, tutorial, free, interactive, course, matt pocock, wizard, beginner, advanced, total, type, script",ogImage:{url:i,alt:u}},children:[(0,s.jsx)(P,{title:u,description:c}),(0,s.jsx)(C,{tutorial:t}),(0,s.jsxs)("main",{className:"relative z-10 flex flex-col gap-5 lg:flex-row",children:[(0,s.jsxs)("div",{className:"px-5",children:[(0,s.jsx)("article",{className:"prose prose-lg w-full max-w-none lg:max-w-xl",children:(0,s.jsx)(b.Z,{contents:r})}),d&&(null==d?void 0:d.length)>0&&(0,s.jsx)(v.Z,{testimonials:d})]}),(0,s.jsxs)("div",{className:"flex w-full flex-col px-5 lg:max-w-sm lg:px-0",children:[t&&(0,s.jsxs)(w.fC,{module:t,lockIconRenderer:()=>(0,s.jsx)(_.Z,{className:"relative z-10 flex-shrink-0 translate-y-1 text-gray-400",width:15,height:15,"aria-hidden":"true"}),children:[(0,s.jsxs)("div",{className:"flex w-full items-baseline justify-between pb-3",children:[(0,s.jsx)("h3",{className:"text-2xl font-semibold",children:"Contents"}),(0,s.jsx)(w.SF,{className:"text-sm opacity-70"})]}),(0,s.jsx)(w.bx,{children:"success"===p?(0,s.jsx)(w.$0,{className:"border px-3 py-3 [&>[data-check-icon]]:text-cyan-300 [&>[data-check-icon]]:opacity-100 [&>[data-progress]]:bg-gray-400/5",children:(0,s.jsx)(w.uh,{className:"border-x border-b border-border bg-background",children:(0,s.jsx)(w.NY,{className:"before:pl-8 [&>div>span]:font-mono [&>div]:pl-2 [&>div]:pr-3 [&_[data-item]]:transition [&_[data-item]]:hover:bg-card [&div>div]:hover:underline"})})}):(0,s.jsx)(k.Od,{className:"border bg-background py-6"})}),(0,s.jsx)(w.uh,{className:"rounded border border-border bg-card",children:"success"===p?(0,s.jsx)(w.NY,{className:"before:pl-8 [&>div>span]:font-mono [&>div]:pl-2 [&>div]:pr-3 [&_[data-item]]:transition [&_[data-item]]:hover:bg-card [&div>div]:hover:underline"}):(0,s.jsx)("div",{className:"px-3",children:(0,s.jsx)(k.Od,{className:"my-1.5 bg-white/5 py-5"})})})]}),(0,s.jsx)(y.Z,{module:t}),(0,s.jsx)(N.Z,{module:t})]})]})]})};let C=e=>{let{tutorial:t}=e,{title:l,slug:n,sections:i,image:c,github:u}=t,{data:p,status:f}=m.SX.moduleProgress.bySlug.useQuery({slug:t.slug.current}),v=((null==p?void 0:p.completedLessonCount)||0)>0,b=null==p?void 0:p.nextSection,y=null==p?void 0:p.nextLesson,N=h()(i),w=h()((null==N?void 0:N.lessons)||t.lessons);return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsxs)("header",{className:"relative z-10 flex flex-col-reverse items-center justify-between px-5 pb-16 pt-0 sm:pb-5 sm:pt-16 md:flex-row",children:[(0,s.jsxs)("div",{className:"w-full text-center md:text-left",children:[(0,s.jsxs)(o(),{href:"/tutorials",className:"group mb-4 inline-flex items-center pb-1 text-base text-primary opacity-80 transition hover:opacity-100",children:[(0,s.jsx)("span",{className:"relative pr-2 transition group-hover:-translate-x-1","aria-hidden":"true",children:"←"})," ",(0,s.jsx)("span",{className:"",children:"All Tutorials"})]}),(0,s.jsx)("h1",{className:"text-center font-text text-4xl font-bold sm:text-5xl md:text-left lg:text-6xl",children:(0,s.jsx)(j.Z,{children:l})}),(0,s.jsxs)("div",{className:"w-full pt-8 text-lg",children:[(0,s.jsx)("div",{className:"flex items-center justify-center gap-3 md:justify-start",children:(0,s.jsxs)("div",{className:"flex items-center gap-3",children:[(0,s.jsx)("div",{className:"flex items-center justify-center overflow-hidden rounded-full",children:(0,s.jsx)(a(),{src:r(63825),alt:"Matt Pocock",width:48,height:48,priority:!0})}),(0,s.jsx)("span",{children:"Matt Pocock"})]})}),(0,s.jsxs)("div",{className:"flex w-full flex-col items-center justify-center gap-3 pt-8 md:flex-row md:justify-start",children:[(0,s.jsxs)(o(),{href:N&&i?{pathname:"/tutorials/[module]/[section]/[lesson]",query:{module:n.current,section:v&&b?null==b?void 0:b.slug:N.slug,lesson:v&&y?null==y?void 0:y.slug:null==w?void 0:w.slug}}:{pathname:"/tutorials/[module]/[lesson]",query:{module:n.current,lesson:v&&y?null==y?void 0:y.slug:null==w?void 0:w.slug}},className:g()("flex w-full items-center justify-center rounded border-2 border-primary bg-primary px-7 py-4 font-semibold leading-tight text-black transition md:w-auto",{"animate-pulse":"loading"===f}),onClick:()=>{(0,x.j)("clicked start learning",{module:n.current})},children:[v?"Continue":"Start"," Learning",(0,s.jsx)(d.J,{name:"Playmark",className:"ml-3 w-2.5 opacity-75","aria-hidden":"true"})]}),(null==u?void 0:u.repo)&&(0,s.jsxs)("a",{className:"flex w-full items-center justify-center gap-2 rounded-md border-2 border-gray-800 px-5 py-4 font-medium leading-tight transition hover:bg-gray-800 md:w-auto",href:"https://github.com/total-typescript/".concat(u.repo),onClick:()=>{(0,x.j)("clicked github code link",{module:n.current})},target:"_blank",rel:"noopener noreferrer",children:[(0,s.jsx)(d.J,{name:"Github",size:"24"})," Code"]})]})]})]}),c&&(0,s.jsx)("div",{className:"flex flex-shrink-0 items-center justify-center lg:-mr-16",children:(0,s.jsx)(a(),{src:c,alt:l,priority:!0,width:450,height:450,quality:100})})]}),(0,s.jsx)(a(),{fill:!0,"aria-hidden":"true",alt:"",src:r(32374),className:"-z-10 object-contain object-top"})]})},P=e=>{let{title:t,description:r}=e;return(0,s.jsx)(c.CourseJsonLd,{courseName:t,description:r||"",provider:{name:"".concat("Matt"," ").concat("Pocock"),type:"Person",url:(0,u.j)()?document.location.href:"https://www.totaltypescript.com"}})};var z=r(41997),Z=!0;let E="learner";var L=e=>{let{tutorial:t,tutorialBodySerialized:r}=e;return(0,s.jsx)(z.pF,{moduleSlug:t.slug.current,children:(0,s.jsx)(S,{tutorial:t,tutorialBodySerialized:r})})}}}]);
//# sourceMappingURL=5975-de57ecc642bd1109.js.map