1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[2623,4789,6601,6463,1682,186,9035],{44693:function(e,t,a){(window.__NEXT_P=window.__NEXT_P||[]).push(["/index_old",function(){return a(78143)}])},70661:function(e,t,a){"use strict";var n=a(50959),r=n&&"object"==typeof n&&"default"in n?n:{default:n};!function(e){if(!e)return;let t=document.createElement("style");t.setAttribute("type","text/css"),t.innerHTML=e,document.head.appendChild(t)}('.rfm-marquee-container {\n overflow-x: hidden;\n display: flex;\n flex-direction: row;\n position: relative;\n width: var(--width);\n transform: var(--transform);\n}\n.rfm-marquee-container:hover div {\n animation-play-state: var(--pause-on-hover);\n}\n.rfm-marquee-container:active div {\n animation-play-state: var(--pause-on-click);\n}\n\n.rfm-overlay {\n position: absolute;\n width: 100%;\n height: 100%;\n}\n.rfm-overlay::before, .rfm-overlay::after {\n background: linear-gradient(to right, var(--gradient-color), rgba(255, 255, 255, 0));\n content: "";\n height: 100%;\n position: absolute;\n width: var(--gradient-width);\n z-index: 2;\n pointer-events: none;\n touch-action: none;\n}\n.rfm-overlay::after {\n right: 0;\n top: 0;\n transform: rotateZ(180deg);\n}\n.rfm-overlay::before {\n left: 0;\n top: 0;\n}\n\n.rfm-marquee {\n flex: 0 0 auto;\n min-width: var(--min-width);\n z-index: 1;\n display: flex;\n flex-direction: row;\n align-items: center;\n animation: scroll var(--duration) linear var(--delay) var(--iteration-count);\n animation-play-state: var(--play);\n animation-delay: var(--delay);\n animation-direction: var(--direction);\n}\n@keyframes scroll {\n 0% {\n transform: translateX(0%);\n }\n 100% {\n transform: translateX(-100%);\n }\n}\n\n.rfm-initial-child-container {\n flex: 0 0 auto;\n display: flex;\n min-width: auto;\n flex-direction: row;\n align-items: center;\n}\n\n.rfm-child {\n transform: var(--transform);\n}');let o=n.forwardRef(function(e,t){let{style:a={},className:o="",autoFill:i=!1,play:s=!0,pauseOnHover:l=!1,pauseOnClick:c=!1,direction:m="left",speed:d=50,delay:u=0,loop:h=0,gradient:p=!1,gradientColor:f="white",gradientWidth:g=200,onFinish:x,onCycleComplete:v,onMount:b,children:w}=e,[y,j]=n.useState(0),[N,k]=n.useState(0),[D,R]=n.useState(1),[C,T]=n.useState(!1),E=n.useRef(null),I=t||E,_=n.useRef(null),S=n.useCallback(()=>{if(_.current&&I.current){let e=I.current.getBoundingClientRect(),t=_.current.getBoundingClientRect(),a=e.width,n=t.width;("up"===m||"down"===m)&&(a=e.height,n=t.height),i&&a&&n?R(n<a?Math.ceil(a/n):1):R(1),j(a),k(n)}},[i,I,m]);n.useEffect(()=>{if(C&&(S(),_.current&&I.current)){let e=new ResizeObserver(()=>S());return e.observe(I.current),e.observe(_.current),()=>{e&&e.disconnect()}}},[S,I,C]),n.useEffect(()=>{S()},[S,w]),n.useEffect(()=>{T(!0)},[]),n.useEffect(()=>{"function"==typeof b&&b()},[]);let A=n.useMemo(()=>i?N*D/d:N<y?y/d:N/d,[i,y,N,D,d]),P=n.useMemo(()=>Object.assign(Object.assign({},a),{"--pause-on-hover":!s||l?"paused":"running","--pause-on-click":!s||l&&!c||c?"paused":"running","--width":"up"===m||"down"===m?"100vh":"100%","--transform":"up"===m?"rotate(-90deg)":"down"===m?"rotate(90deg)":"none"}),[a,s,l,c,m]),Z=n.useMemo(()=>({"--gradient-color":f,"--gradient-width":"number"==typeof g?"".concat(g,"px"):g}),[f,g]),M=n.useMemo(()=>({"--play":s?"running":"paused","--direction":"left"===m?"normal":"reverse","--duration":"".concat(A,"s"),"--delay":"".concat(u,"s"),"--iteration-count":h?"".concat(h):"infinite","--min-width":i?"auto":"100%"}),[s,m,A,u,h,i]),F=n.useMemo(()=>({"--transform":"up"===m?"rotate(90deg)":"down"===m?"rotate(-90deg)":"none"}),[m]),z=n.useCallback(e=>[...Array(Number.isFinite(e)&&e>=0?e:0)].map((e,t)=>r.default.createElement(n.Fragment,{key:t},n.Children.map(w,e=>r.default.createElement("div",{style:F,className:"rfm-child"},e)))),[F,w]);return C?r.default.createElement("div",{ref:I,style:P,className:"rfm-marquee-container "+o},p&&r.default.createElement("div",{style:Z,className:"rfm-overlay"}),r.default.createElement("div",{className:"rfm-marquee",style:M,onAnimationIteration:v,onAnimationEnd:x},r.default.createElement("div",{className:"rfm-initial-child-container",ref:_},n.Children.map(w,e=>r.default.createElement("div",{style:F,className:"rfm-child"},e))),z(D-1)),r.default.createElement("div",{className:"rfm-marquee",style:M},z(D))):null});t.Z=o},26463:function(e,t,a){"use strict";a.r(t),a.d(t,{default:function(){return x}});var n=a(11527),r=a(95020),o=a(45924),i=a(50959),s=a(27765);let l=(0,i.createContext)(null);var c=a(78758),m=a(68168);let d=e=>!e.isLayoutDirty&&e.willUpdate(!1),u=e=>!0===e,h=e=>u(!0===e)||"id"===e,p=e=>{let{children:t,id:a,inherit:r=!0}=e,o=(0,i.useContext)(s.p),p=(0,i.useContext)(l),[f,g]=function(){let e=function(){let e=(0,i.useRef)(!1);return(0,c.L)(()=>(e.current=!0,()=>{e.current=!1}),[]),e}(),[t,a]=(0,i.useState)(0),n=(0,i.useCallback)(()=>{e.current&&a(t+1)},[t]);return[(0,i.useCallback)(()=>m.Wi.postRender(n),[n]),t]}(),x=(0,i.useRef)(null),v=o.id||p;
1null===x.current&&(h(r)&&v&&(a=a?v+"-"+a:v),x.current={id:a,group:u(r)&&o.group||function(){let e=new Set,t=new WeakMap,a=()=>e.forEach(d);return{add:n=>{e.add(n),t.set(n,n.addEventListener("willUpdate",a))},remove:n=>{e.delete(n);let r=t.get(n);r&&(r(),t.delete(n)),a()},dirty:a}}()});let b=(0,i.useMemo)(()=>({...x.current,forceRender:f}),[g]);return(0,n.jsx)(s.p.Provider,{value:b,children:t})};var f=a(34790),g=a(1143),x=(0,i.memo)(e=>{let{children:t,heading:a,className:i,hClassName:s,proseClassName:l,blended:c=!1,prose:m=!0,shouldAnimate:d=!0,...u}=e;return(0,n.jsx)(p,{children:(0,n.jsx)(f.E.div,{className:(0,g.cn)("flex w-screen flex-1 content-center justify-center bg-gradient-to- from-base-100 to-base-100 py-12 will-change-transform",i&&i),...r.xz,viewport:{amount:.05,once:!0},transition:{duration:d?.5:0},...u,children:(0,n.jsxs)(f.E.div,{layout:"position",className:(0,o.Z)("grid w-full content-center px-4 text-left",m&&"prose-xl prose","prose-ps:my-3 prose-a:font-bold prose-a:text-secondary prose-a:decoration-transparent hover:prose-a:text-secondary/60 prose-strong:font-extrabold prose-video:my-0",l),children:[(0,n.jsx)(f.E.h2,{className:(0,o.Z)("bg-gradient-to-b bg-clip-text text-center text-6xl font-extrabold text-transparent md:text-7xl lg:text-9xl","from-base-200 to-base-content dark:opacity-50 opacity-30 my-[3vh] max-w-3xl mx-auto"),layout:"position",children:a}),(0,n.jsx)("div",{children:t})]})})})})},34789:function(e,t,a){"use strict";a.r(t),a.d(t,{default:function(){return m}});var n=a(11527),r=a(73161),o=a(34790),i=a(44486),s=a.n(i),l=a(26463);let c=s()(()=>a.e(9279).then(a.bind(a,10444)),{loadableGenerated:{webpack:()=>[10444]},ssr:!1});function m(){let{data:e,isLoading:t}=r.h.post.getFreeAnimations.useQuery(void 0,{refetchOnWindowFocus:!1,keepPreviousData:!0,cacheTime:864e5,initialData:[]});return t||!e?(0,n.jsx)(o.E.div,{initial:{opacity:0}
1,animate:{opacity:1},className:"h-screen max-w-[screen]",children:(0,n.jsx)("progress",{className:"progress progress-primary w-56"})}):(0,n.jsxs)(l.default,{heading:(0,n.jsxs)("span",{children:["free",(0,n.jsx)("br",{}),"resources"]}),className:"min-h-auto items-start justify-center via-lime-500/20 py-[10vh] dark:via-lime-500/20",hClassName:"from-lime-500/0 to-lime-500/70 mb-[5vh]",prose:!1,viewport:{amount:0,once:!0},children:[(0,n.jsx)("div",{className:"prose-ps:my-3 prose-2xl prose mx-auto mb-16 px-4 text-left prose-a:font-bold prose-a:text-secondary prose-a:decoration-transparent hover:prose-a:text-secondary-focus prose-strong:font-extrabold prose-video:my-0",children:(0,n.jsxs)("p",{children:["This"," ",(0,n.jsx)("span",{className:"animate-text bg-gradient-to-r from-lime-500 to-emerald-500 bg-clip-text font-black text-transparent",children:"sneak peek"})," ","allows ",(0,n.jsx)("b",{children:"you"})," to assess the offerings and make a knowledgeable choice regarding acquiring the comprehensive lifetime license",(0,n.jsxs)("span",{className:"animate-text bg-gradient-to-r from-yellow-500 via-purple-500 to-emerald-500 bg-clip-text font-black text-transparent",children:[" ","full lifetime license"]}),", granting access to the entire array of animations in our collection."]})}),(0,n.jsx)("div",{className:"container mx-auto my-12 max-w-[screen] overflow-hidden",children:(0,n.jsx)("div",{className:"grid grid-cols-2 gap-4 p-4 md:grid-cols-4 xl:grid-cols-4",children:e.map(e=>(0,n.jsx)(c,{post:e},e.id))})})]})}s()(()=>Promise.all([a.e(4891),a.e(6494)]).then(a.bind(a,27548)),{loadableGenerated:{webpack:()=>[27548]},ssr:!1})},16601:function(e,t,a){"use strict";a.r(t),a.d(t,{default:function(){return l}});var n=a(11527),r=a(72693),o=a.n(r),i=a(26463);let s=[{name:"MichaÅ PierzchaÅa",comment:"Catalin is the go-to person when you need to learn about React Native animations. I enjoy code snippets he shares. AnimateReactNative.com looks like great place to browse, learn and âstealâ some of his ideas.",jobTitle:"Head of Technology at Callstack",twitter:"thymikee"},{name:"Paul",jobTitle:"CTO at itsdisco.com",comment:"My go-to resource for anything React Native animated. Not just some great ideas to use in our app, but a great learning resource too to see how animated components should be done!"},{name:"Enes",comment:"Catalin is one of the primer experts for those seeking remarkable mobile animations and UI interactions. With years of experience and a portfolio of impressive work, I would highly recommend you to check this project out.",jobTitle:"Senior Software Developer",twitter:"enesozturkdev"},{name:"Mo Gorhom",comment:"[Recommended] The best react native complex animated components collection by @mironcatalin",jobTitle:"Creator of Bottom Sheet",twitter:"gorhom"},{name:"Cedric",comment:"Learn how to create stunning animations in React Native! One of the best collections of material, from a wholesome creator. Highly recommend it!",jobTitle:"Doing stuff with \uD835\uDF60Expo",twitter:"cedric_dev"},{name:"Aman Mittal",comment:"AnimateReactNative.com is one of the most comprehensive and complete collections of awesome animations I've seen in React Native world. The variety of examples shared here covers most real-world use cases. If you are looking to learn about different types of animation in React Native or find something for your next app, I highly recommend checking out AnimateReactNative.com!",jobTitle:"Docs at \uD835\uDF60Expo",twitter:"amanhimself"},{name:"Tomasz Sapeta",comment:"AnimateReactNative.com by @mironcatalin - the repository with the most eye-catching \uD83E\uDD29 animations for React Native, approved by the authors of react-native-reanimated from Software Mansion â
",jobTitle:"Crafting software at Software Mansion & \uD835\uDF60Expo",twitter:"tsapeta"},{name:"Vadim Savin",comment:"If you don't want to spend hours building animations yourself, check out the new product @mironcatalin just launched. More than 100 premium React Native Animations that make you go \uD83E\uDD24",jobTitle:"notJust.dev creator",twitter:"VadimNotJustDev"},{name:"Code Ninja",comment:"Catalin I got the good news I have been offered a scholarship to MIT. Thanks for the great videos and content! I used the shared element transitions to build a project showcase that allowed me to attend MIT.",jobTitle:"React Ninja",twitter:"ajaga_abdbasit"},{name:"Tomasz Czajecki",comment:"Oh wow this is stunningly beautiful \uD83E\uDD29. Now I want to write any app just to find an excuse to build something like this.",jobTitle:"Software engineer \uD835\uDF60Expo",twitter:"tchayen"},{name:"ROFI",comment:"Catalin is one of the best out there when it comes to animations. The amount of animations in the pack is huge!",jobTitle:"Creator of uni-stack.dev",twitter:"bidah"},{name:"Fransis",comment:"You suck doing animations in React-Native? Now it is the time to be a PRO. Grab this AWESOME collection from a great guy",jobTitle:"Senior React Native Developer @callstackio",twitter:"IronTonyTheDev"},{name:"Kacper KapuÅciak",comment:'High concentration of "ohhhhh s
1o that\'s how you do it" 10/10 would recommend',jobTitle:"React Native Developer at Software Mansion",twitter:"kacperkapusciak"},{name:"Daniel Dunderfelt",comment:"I didn't know about this! All the animations look fantastic \uD83E\uDD29 Great deal, this will save me a lot of time and make my apps look sweet \uD83D\uDE0E. A pretty instant buy at this price.",jobTitle:"",twitter:"ddunderfelt"},{name:"Gopx",comment:"Following your journey over the past few years has been inspiring. Keep up the awesome work! \uD83D\uDCAF",jobTitle:"",twitter:"bettercallgopal"},{name:"Brice Zele",comment:"Thank you for the valuable lessons I've learned from your videos on React Native animations. They have really helped me improve my skills, and I appreciate the time and effort you put into creating such helpful content! I am a happy customer of http://animatereactnative.com",jobTitle:"D\xe9veloppeur Mobile",twitter:"bricezele"},{name:"Upendra Sahni",comment:"Huge thanks to @mironcatalin for the amazing tutorial in React Native Animation! \uD83D\uDE4C I recreated it using React Native Reanimated and loved the process. Your content is super helpful! ",jobTitle:"React Native Developer",twitter:"Upendra17916450"},{name:"Alexey Kureev",comment:"I personally bought access and can assure you it is absolutely worth it. Amount of time I saved / knowledge I acquired is tremendous. Strongly recommend â
",jobTitle:"Founder @ Provenity",twitter:"kureevalexey"},{name:"Yogesh Kumar",comment:"If you are looking for anything above the bare minimum while building in react native, you need to see this \uD83E\uDDD1â\uD83D\uDCBB. I own a subscription and it's way more than it's worth for the amount you spend vs the quality you get \uD83D\uDCAF",jobTitle:"Building digital things",twitter:"itsyogesh18"},{name:"Hirbod",comment:'It\'s such a great resource for looking things up, finding inspiration, copying some code, or learning "how to make it" really quick. Again, highly recommended!',jobTitle:"Full-Stack tech lead with very strong design background",twitter:"hirbod_dev"},{name:"David Leuliette",comment:"People often ask me why a I freelance? because I can buy tools that makes me a better dev, and contribute to the community in the meantime.\nI bought the team plan from AnimateReactNative.com because @mironcatalin is cooking cool sh4t that make me jealous",jobTitle:"weshipit.today",twitter:"flexbox_"}];function l(){return(0,n.jsx)(i.default,{heading:"from the community",className:"via-sky-500/30 dark:via-sky-500/20 w-auto",hClassName:"from-sky-500/0 to-sky-500/70",prose:!1,children:(0,n.jsx)("div",{className:"w-screen flex flex-1 items-center",children:(0,n.jsx)("div",{className:"mx-auto max-w-7xl px-2 md:px-8 lg:px-8",children:(0,n.jsx)("div",{className:"mx-auto mt-16 flow-root max-w-2xl sm:mt-20 lg:mx-0 lg:max-w-none",children:(0,n.jsx)("div",{className:"-mt-8 sm:-mx-4 sm:columns-2 sm:text-[0] lg:columns-3",children:s.map((e,t)=>(0,n.jsx)("div",{className:"pt-8 sm:inline-block sm:w-full sm:px-4",children:(0,n.jsxs)("figure",{className:"bg-base-100/70 rounded-2xl p-8 text-sm leading-6 shadow-lg ring-1 dark:right-sky-500/20 ring-sky-500/30 text-balance",children:[(0,n.jsx)("p",{children:"â".concat(e.comment,"â")}),(0,n.jsxs)("figcaption",{className:"mt-6 flex items-center gap-x-4",children:[(0,n.jsx)("div",{className:"relative isolate justify-center items-center flex",children:e.twitter?(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(o(),{src:"https://unavatar.io/twitter/".concat(e.twitter),width:200,height:200,alt:"".concat(e.name," @").concat(e.twitter),className:"h-10 w-10 rounded-full"}),(0,n.jsx)(o(),{src:"https://unavatar.io/twitter/".concat(e.twitter),width:200,height:200,alt:"".concat(e.name," @").concat(e.twitter),className:"scale-150 m-auto blur-md opacity-40 dark:opacity-20 absolute inset-0 -z-10"})]}):(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)("div",{className:"h-10 w-10 rounded-full bg-neutral-500/60 scale-150 m-auto blur-md opacity-40 dark:opacity-20 absolute inset-0 -z-10"}),(0,n.jsx)("div",{className:"h-10 w-10 rounded-full bg-neutral-500/50"})]})}),(0,n.jsxs)("div",{className:"flex flex-col justify-center",children:[(0,n.jsx)("p",{className:"font-semibold text-base-content leading-none",children:e.name}),e.twitter&&(0,n.jsxs)("a",{href:"https://twitter.com/".concat(e.twitter),target:"_blank",rel:"noreferrer",className:"text-xs block",children:["@",e.twitter]}),(0,n.jsx)("p",{className:"text-gray-500 text-[10px] leading-tight mt-2",children:e.jobTitle})]})]})]})},t))})})})})})}},63575:function(e,t,a){"use strict";a.d(t,{w:function(){return m}});var n=a(11527),r=a(32605),o=a(72693),i=a.n(o),s=a(70661),l=a(82198);function c(){return(0,n.jsxs)("div",{className:"flex md:gap-24 md:mr-24 gap-8 mr-8 items-center md:h-16 h-16 filter saturate-0",children:[(0,n.jsx)(l.Z,{src:"https://cdn.jsdelivr.net/gh/devicons/devicon/icons/javascript/javascript-plain.svg",className:"h-full w-auto text-base-content",title:"JavaScript language",preProcessor:e=>
1e.replace(/fill=".*?"/g,'fill="currentColor"'),width:200,height:200}),(0,n.jsx)(l.Z,{src:"https://cdn.jsdelivr.net/gh/devicons/devicon/icons/typescript/typescript-plain.svg",className:"h-full w-auto text-base-content",title:"TypeScript language",preProcessor:e=>e.replace(/fill=".*?"/g,'fill="currentColor"'),width:200,height:200}),(0,n.jsx)(l.Z,{src:"https://cdn.jsdelivr.net/gh/devicons/devicon/icons/react/react-original-wordmark.svg",className:"h-full w-auto text-base-content",title:"React Native - a framework for building native apps using React",preProcessor:e=>e.replace(/fill=".*?"/g,'fill="currentColor"'),width:200,height:200}),(0,n.jsx)(i(),{src:"/react-native-logo-.webp",width:400,height:200,className:"m-auto h-full w-auto text-base-100 filter invert-[100%] dark:invert-[0%]",alt:"React Native - Learn once, write anywhere."}),(0,n.jsx)("a",{href:"https://expo.dev",target:"_blank",rel:"noreferrer",className:"h-full w-auto py-2",children:(0,n.jsx)(l.Z,{src:"/expo-logo.svg",className:"h-full w-auto text-base-content",title:"expo.dev - Create amazing apps that run everywhere",preProcessor:e=>
1e.replace(/fill=".*?"/g,'fill="currentColor"')})}),(0,n.jsx)("a",{href:"https://github.com/software-mansion/react-native-reanimated/",target:"_blank",rel:"noreferrer",className:"h-full",children:(0,n.jsxs)("div",{className:"flex flex-row gap-x-4 h-full w-auto py-2",children:[(0,n.jsx)(l.Z,{src:"/react-native-reanimated-logo-horse.svg",className:"m-auto h-full w-auto text-base-content",title:"React Native Reanimated - Beyond the limitations",preProcessor:e=>e.replace(/fill=".*?"/g,'fill="currentColor"').replace(/stroke=".*?"/g,'stroke="currentColor"')}),(0,n.jsx)(l.Z,{src:"/react-native-reanimated-logo.svg",className:"m-auto h-full w-auto text-base-content",title:"React Native Reanimated - Beyond the limitations",preProcessor:e=>e.replace(/fill=".*?"/g,'fill="currentColor"').replace(/stroke=".*?"/g,'stroke="currentColor"')})]})}),(0,n.jsx)("a",{href:"https://github.com/software-mansion/react-native-gesture-handler/",target:"_blank",rel:"noreferrer",className:"h-full",children:(0,n.jsxs)("div",{className:"flex flex-row gap-x-4 h-full py-2",children:[(0,n.jsx)(l.Z,{src:"/react-native-gesture-handler-logo.svg",className:"m-auto h-full w-auto text-base-content",title:"React Native Reanimated - Beyond the limitations",preProcessor:e=>
1e.replace(/fill=".*?"/g,'fill="currentColor"')}),(0,n.jsx)(l.Z,{src:"/react-native-gesture-handler-text.svg",className:"h-full m-auto w-auto text-base-content",title:"React Native Reanimated - Beyond the limitations",preProcessor:e=>e.replace(/fill=".*?"/g,'fill="currentColor"')})]})}),(0,n.jsx)("a",{href:"https://moti.fyi/",target:"_blank",rel:"noreferrer",className:"h-full",children:(0,n.jsx)(l.Z,{src:"https://moti.fyi/img/logo-grad.svg",title:"moti.fyi - a motion library for React Native filter",className:"h-full w-auto filter py-2"})}),(0,n.jsx)("a",{href:"https://reactnavigation.org/",target:"_blank",rel:"noreferrer",className:"h-full",children:(0,n.jsxs)("div",{className:"text-base-content flex items-center h-full gap-x-4 py-2",children:[(0,n.jsx)(l.Z,{src:"https://reactnavigation.org/img/spiro.svg",title:"https://reactnavigation.org/ - a routing and navigation library for React Native",className:"h-full w-auto aspect-square",preProcessor:e=>e.replace(/stroke=".*?"/g,'stroke="currentColor"')}),(0,n.jsx)("p",{className:"whitespace-pre text-2xl font-semibold font-sans",children:"react navigation"})]})}),(0,n.jsx)("p",{className:"m-0 bg-gradient-to-r from-teal-500/50 to-amber-500 bg-clip-text text-5xl font-black text-transparent md:text-5xl font-sans",children:"Animated.API"})]})}function m(){return(0,n.jsxs)("div",{className:"flex md:h-44 h-24 relative items-center",children:[(0,n.jsx)(r.c,{direction:"to-left",blurStart:0,blurEnd:8,layers:4,className:"absolute md:w-80 w-1/5 top-0 bottom-0 z-10"}),(0,n.jsx)(s.Z,{autoFill:!0,speed:70,children:(0,n.jsx)(c,{})}),(0,n.jsx)(r.c,{direction:"to-right",blurStart:0,blurEnd:8,layers:4,className:"absolute md:w-80 w-1/5 right-0 top-0 bottom-0 z-10"})]})}},78143:function(e,t,a){"use strict";a.r(t),a.d(t,{__N_SSP:function(){return y},default:function(){return j}});var n=a(11527),r=a(52290),o=a(34789),i=a(27234),s=a(16601),l=a(44486),c=a.n(l),m=a(72693),d=a.n(m),u=a(82198),h=a(63575);let p=c()(()=>Promise.resolve().then(a.bind(a,26463)),{loadableGenerated:{webpack:()=>[26463]},ssr:!1});var f=function(){return(0,n.jsx)(p,{heading:"Tools & Libraries",hClassName:"from-base-100 to-base-content mb-12",blended:!0,className:"max-w-xl bg-none",shouldAnimate:!1,children:(0,n.jsxs)("div",{className:"m-auto mt-12 flex max-w-xl flex-1 flex-row flex-wrap items-center justify-center gap-12 bg-transparent md:gap-12",children:[(0,n.jsx)("div",{className:"w-screen",children:(0,n.jsx)(h.w,{})}),(0,n.jsx)("p",{children:"Supercharge your mobile app with our rich set of animation components, built using the latest and most reliable technologies in the React Native ecosystem. Weâve done the heavy lifting so you can focus on creating seamless, dynamic user experiences."}),(0,n.jsx)(u.Z,{src:"https://cdn.jsdelivr.net/gh/devicons/devicon/icons/javascript/javascript-plain.svg",className:"h-20 w-20",title:"JavaScript language",width:80,height:80}),(0,n.jsx)(u.Z,{src:"https://cdn.jsdelivr.net/gh/devicons/devicon/icons/typescript/typescript-plain.svg",className:"h-20 w-20",title:"TypeScript language",width:80,height:80}),(0,n.jsx)(u.Z,{src:"https://cdn.jsdelivr.net/gh/devicons/devicon/icons/react/react-original-wordmark.svg",className:"h-20 w-20",title:"React Native - a framework for building native apps using React",width:80,height:80}),(0,n.jsx)("p",{children:"In our source code, youâll find not only animations but a wealth of techniques that highlight React Native best practices, optimization strategies, and reusable patterns. Learn from real-world examples to accelerate your development process."}),(0,n.jsxs)("p",{className:"p-4 -mt-10 relative",children:[(0,n.jsx)("span",{className:"bg-gradient-to-r from-transparent to-purple-500/30 absolute -inset-4 blur-xl"}),(0,n.jsx)("strong",{className:"wavy decoration-base-content/30",children:"Perfect for rapid deployment and polished results."})," ","Donât let animation be an afterthoughtâmake it the core of your user experience today."]}),(0,n.jsx)("a",{href:"https://github.com/software-mansion/react-native-reanimated/",target:"_blank",rel:"noreferrer",children:(0,n.jsxs)("p",{className:"m-0 bg-gradient-to-l from-base-content/50 to-accent bg-clip-text text-4xl font-black text-transparent md:text-6xl font-sans tracking-tighter",children:["reanimated"," ",(0,n.jsxs)("span",{className:"align-super tracking-tighter",style:{fontSize:"smaller"},children:["2",(0,n.jsx)("span",{className:"text-[70%] -mx-2",children:" & "}),"3"]})]})}),(0,n.jsx)("a",{href:"https://reactnative.dev/",target:"_blank",rel:"noreferrer",className:"w-full justify-center text-center",children:(0,n.jsx)(d(),{src:"/react-native-logo-.webp",width:400,height:200,className:"m-auto h-auto w-2/3 text-base-content",alt:"React Native - Learn once, write anywhere."})}),(0,n.jsx)("a",{href:"https://expo.dev",target:"_blank",rel:"noreferrer",className:"w-full justify-center text-center",children:(0,n.jsx)(u.Z,{src:"/expo-logo.svg",className:"m-auto h-auto w-2/3 text-base-content",title:"expo.dev - Create amazing apps that run everywhere",preProcessor:e=>
1e.replace(/fill=".*?"/g,'fill="currentColor"')})}),(0,n.jsx)("a",{href:"https://github.com/software-mansion/react-native-gesture-handler/",target:"_blank",rel:"noreferrer",children:(0,n.jsx)("p",{className:"m-0 block w-full bg-gradient-to-r from-base-content/50 to-primary bg-clip-text text-4xl font-black text-transparent md:text-6xl font-sans whitespace-nowrap",children:"gesture handler"})}),(0,n.jsxs)("div",{className:"flex w-full flex-row items-center",children:[(0,n.jsx)("a",{href:"https://moti.fyi/",target:"_blank",rel:"noreferrer",children:(0,n.jsx)(u.Z,{src:"https://moti.fyi/img/logo-grad.svg",title:"moti.fyi - a motion library for React Native",className:"h-auto w-3/5"})}),(0,n.jsxs)("a",{href:"https://reactnavigation.org/",target:"_blank",rel:"noreferrer",className:" text-purple-400",children:[(0,n.jsx)(u.Z,{src:"https://reactnavigation.org/img/spiro.svg",title:"https://reactnavigation.org/ - a routing and navigation library for React Native",className:"mx-auto mb-2 h-24 w-24",preProcessor:e=>e.replace(/stroke=".*?"/g,'stroke="currentColor"')}),(0,n.jsx)("p",{className:"whitespace-pre text-xl font-semibold font-sans",children:"react navigation"})]})]}),(0,n.jsx)("a",{href:"https://reactnative.dev/docs/animated",target:"_blank",rel:"noreferrer",children:(0,n.jsx)("p",{className:"m-0 block w-full bg-gradient-to-r from-teal-500/50 to-amber-500 bg-clip-text text-5xl font-black text-transparent md:text-6xl font-sans",children:"Animated.API"})})]})})};c()(()=>a.e(6430).then(a.bind(a,96430)),{loadableGenerated:{webpack:()=>[96430]},ssr:!0,loading:()=>(0,n.jsx)("div",{className:"h-screen"})});let g=c()(()=>a.e(1319).then(a.bind(a,11319)),{loadableGenerated:{webpack:()=>[11319]},ssr:!0}),x=c()(()=>a.e(818).then(a.bind(a,60818)),{loadableGenerated:{webpack:()=>[60818]},ssr:!0}),v=c()(()=>a.e(6522).then(a.bind(a,98316)),{loadableGenerated:{webpack:()=>[98316]},ssr:!0,loading:()=>(0,n.jsx)("div",{className:"h-screen"})}),b=c()(()=>a.e(1336).then(a.bind(a,21336)),{loadableGenerated:{webpack:()=>[21336]},ssr:!0});c()(()=>a.e(1540).then(a.bind(a,61540)),{loadableGenerated:{webpack:()=>[61540]},ssr:!0}),c()(()=>a.e(6172).then(a.bind(a,92300)),{loadableGenerated:{webpack:()=>[92300]},ssr:!0,loading:()=>(0,n.jsx)("div",{className:"h-screen"})});let w=c()(()=>a.e(5960).then(a.bind(a,85960)),{loadableGenerated:{webpack:()=>[85960]},ssr:!0,loading:()=>(0,n.jsx)("div",{className:"h-screen"})});var y=!0,j=()=>{let[e,t]=(0,i._)("alternateIntro","new");return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(r.Z,{}),(0,n.jsxs)("main",{className:"bg-base-100 flex min-h-screen max-w-[screen] flex-col items-center justify-center text-center",children:[(0,n.jsx)(f,{}),!1,(0,n.jsx)(v,{}),(0,n.jsx)(x,{}),(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(w,{}),(0,n.jsx)(o.default,{}),(0,n.jsx)(b,{}),(0,n.jsx)(s.default,{}),(0,n.jsx)(g,{})]})]})]})}}},function(e){e.O(0,[2777,2444,2693,3717,1143,2290,2888,9774,179],function(){return e(e.s=44693)}),_N_E=e.O()}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.