PageSourceSearch

https://stalliontech.io/learn/docs/sdk/installation

html stalliontech.io collected 2026-10-03 21:13:42 UTC 182,535 bytes, 142 lines download raw bytes

1<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" href="/learn/_next/static/media/3f5170f2649be2e5-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/learn/_next/static/media/fc727f226c737876-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="stylesheet" href="/learn/_next/static/css/0790576569b8c287.css" data-precedence="next"/><link rel="stylesheet" href="/learn/_next/static/css/781449e376c693a2.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/learn/_next/static/chunks/webpack-e44a3cf9c8845c8e.js"/>
1<script src="/learn/_next/static/chunks/4bd1b696-acc86d6ecd70321d.js" async=""></script>
1<script src="/learn/_next/static/chunks/517-26347af7aa83fd59.js" async=""></script>
1<script src="/learn/_next/static/chunks/main-app-47f91498a05a1f78.js" async=""></script>
1<script src="/learn/_next/static/chunks/839-491be9e7f5652a05.js" async=""></script>
1<script src="/learn/_next/static/chunks/365-a52c3d1c3aa311cc.js" async=""></script>
1<script src="/learn/_next/static/chunks/23-90641466f3bb2795.js" async=""></script>
1<script src="/learn/_next/static/chunks/531-45f60e11e2b10d1b.js" async=""></script>
1<script src="/learn/_next/static/chunks/178-cc4608b502ffc181.js" async=""></script>
1<script src="/learn/_next/static/chunks/583-5f6d92491e21849f.js" async=""></script>
1<script src="/learn/_next/static/chunks/460-c19bf6dfa8d62bcf.js" async=""></script>
1<script src="/learn/_next/static/chunks/473-def3eddc7671c707.js" async=""></script>
1<script src="/learn/_next/static/chunks/app/layout-23eab13111997091.js" async=""></script>
1<script src="/learn/_next/static/chunks/140-38b38c63288b6c5d.js" async=""></script>
1<script src="/learn/_next/static/chunks/app/docs/%5B%5B...slug%5D%5D/page-4f333ec4fedcfb8c.js" async=""></script>
1<script src="/learn/_next/static/chunks/app/error-a1b6678d49d2b46b.js" async=""></script>
1<script src="/learn/_next/static/chunks/app/docs/layout-73220267cf61be31.js" async=""></script>
1<meta name="next-size-adjust"/><title>Installation | React Native Stallion</title><meta name="description" content="React Native Stallion installation guide - Get started with OTA updates in 5 easy steps. Install SDK and CLI for React Native apps. Complete setup instructions."/><link rel="canonical" href="https://stalliontech.io/learn/docs/sdk/installation"/><meta property="og:title" content="Installation | React Native Stallion"/><meta property="og:description" content="React Native Stallion installation guide - Get started with OTA updates in 5 easy steps. Install SDK and CLI for React Native apps. Complete setup instructions."/><meta property="og:url" content="https://stalliontech.io/learn/docs/sdk/installation"/><meta property="og:site_name" content="React Native Stallion"/><meta property="og:type" content="article"/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:title" content="React Native Stallion Documentation"/><meta name="twitter:description" content="The best CodePush alternative for React Native OTA updates."/><link rel="icon" href="https://assets.stalliontech.io/favicon.ico"/><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/devicon.min.css"/>
1<script type="application/ld+json">{"@context":"https://schema.org","@type":"SoftwareApplication","name":"React Native Stallion","applicationCategory":"DeveloperApplication","operatingSystem":"React Native","offers":{"@type":"Offer","price":"0","priceCurrency":"USD"},"description":"React Native Stallion is a modern OTA update platform for React Native apps. Get patch updates, advanced controls, and seamless integration. Perfect CodePush alternative.","url":"https://stalliontech.io/learn/","author":{"@type":"Organization","name":"Stallion Tech","url":"https://stalliontech.io"},"aggregateRating":{"@type":"AggregateRating","ratingValue":"4.8","ratingCount":"100"}}</script>
1<script src="/learn/_next/static/chunks/polyfills-42372ed130431b0a.js" noModule=""></script>
1</head><body class="__variable_0e2adc __variable_7f3a7b font-regular antialiased tracking-wide">
1<script>!function(){try{var d=document.documentElement,c=d.classList;c.remove('light','dark');var e=localStorage.getItem('theme');if('system'===e||(!e&&true)){var t='(prefers-color-scheme: dark)',m=window.matchMedia(t);if(m.media!==t||m.matches){d.style.colorScheme = 'dark';c.add('dark')}else{d.style.colorScheme = 'light';c.add('light')}}else if(e){c.add(e|| '')}if(e==='light'||e==='dark')d.style.colorScheme=e}catch(e){}}()</script>
1<div class="transition-[margin] duration-300 ease-in-out"><nav class="w-full border-b border-border/60 h-16 sticky top-0 z-50 bg-background/80 backdrop-blur-md supports-[backdrop-filter]:bg-background/60"><div class="sm:container mx-auto w-[95vw] h-full flex items-center sm:justify-between md:gap-2"><div class="flex items-center sm:gap-5 gap-2.5"><button class="items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-9 w-9 md:hidden flex" type="button" aria-haspopup="dialog" aria-expanded="false" aria-controls="radix-:Rl9lb:" data-state="closed"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-align-left"><line x1="21" x2="3" y1="6" y2="6"></line><line x1="15" x2="3" y1="12" y2="12"></line><line x1="17" x2="3" y1="18" y2="18"></line></svg></button><div class="flex items-center gap-6"><div class="sm:flex hidden"><a class="flex items-center gap-2.5" href="/learn"><img alt="[object Object]" loading="lazy" width="92" height="61" decoding="async" data-nimg="1" style="color:transparent" src="/learn/_next/static/media/stallion-docs-logo.73aa2b2e.svg"/></a></div><div class="md:flex hidden items-center gap-4 text-sm font-medium text-muted-foreground"><a class="flex items-center gap-1 sm:text-base text-[14.5px] dark:text-stone-300/85 text-stone-800 !text-primary dark:font-medium font-semibold" href="/learn/docs/introduction">Documentation</a><a class="flex items-center gap-1 sm:text-base text-[14.5px] dark:text-stone-300/85 text-stone-800" href="/learn/blogs">Blog</a><a class="flex items-center gap-1 sm:text-base text-[14.5px] dark:text-stone-300/85 text-stone-800" href="https://discord.gg/HzqsrKF5wv">Community</a></div></div></div><div class="flex items-center sm:justify-normal justify-between sm:gap-3 ml-1 sm:w-fit w-[90%]"><div class="flex items-center gap-2"><div class="relative w-full sm:w-fit"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search documentation (Command+K)"><span class="DocSearch-Button-Container"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20" aria-hidden="true"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search docs…</span></span><span class="DocSearch-Button-Keys"></span></button><div class="pointer-events-none absolute right-2 top-1/2 hidden -translate-y-1/2 items-center gap-0.5 font-code text-xs sm:flex"><kbd class="rounded-md border border-neutral-300 bg-background/30 px-1 py-0.5 dark:border-neutral-700">Ctrl</kbd><kbd class="rounded-md border border-neutral-300 bg-background/30 px-[0.28rem] py-0.5 dark:border-neutral-700">K</kbd></div></div><button type="button" aria-label="Ask Stallion AI" aria-pressed="false" class="flex h-9 shrink-0 items-center gap-1.5 whitespace-nowrap rounded-md border border-brand/40 px-2.5 text-sm font-medium text-brand-strong transition-colors hover:bg-brand/20 bg-brand/10"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles size-4"><path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"></path><path d="M20 3v4"></path><path d="M22 5h-4"></path><path d="M4 17v2"></path><path d="M5 18H3"></path></svg><span class="hidden sm:inline">Ask Stallion</span><span class="hidden rounded bg-brand/20 px-1 py-0.5 text-[9px] font-semibold uppercase leading-none tracking-wide sm:inline">beta</span></button></div><div class="flex items-center justify-between sm:gap-2"><div class="flex ml-4 sm:ml-0"><a class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-9 w-9" href="https://github.com/stallion-tech/react-native-stallion"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-github h-[1.1rem] w-[1.1rem]"><path d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4"></path><path d="M9 18c-4.51 2-5-2-7-2"></path></svg></a><a class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-9 w-9" href="https://www.linkedin.com/company/stalliontechnologies"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-linkedin h-[1.1rem] w-[1.1rem]"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"></path><rect width="4" height="12" x="2" y="9"></rect><circle cx="4" cy="4" r="2"></circle></svg></a><button class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-9 w-9" type="button" id="radix-:R799lb:" aria-haspopup="menu" aria-expanded="false" data-state="closed"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sun h-[1.1rem] w-[1.1rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0"><circle cx="12" cy="12" r="4"></circle><path d="M12 2v2"></path><path d="M12 20v2"></path><path d="m4.93 4.93 1.41 1.41"></path><path d="m17.66 17.66 1.41 1.41"></path><path d="M2 12h2"></path><path d="M20 12h2"></path><path d="m6.34 17.66-1.41 1.41"></path><path d="m19.07 4.93-1.41 1.41"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-moon absolute h-[1.1rem] w-[1.1rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100"><path d="M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z"></path></svg><span class="sr-only">Toggle theme</span></button></div></div></div></div></nav>
1<main class="sm:container mx-auto w-[90vw] h-auto scroll-smooth"><div class="flex items-start gap-8"><aside class="md:flex hidden flex-[1.5] min-w-[238px] sticky top-16 flex-col h-[93.75vh] overflow-y-auto"><div dir="ltr" class="relative overflow-hidden py-4" style="position:relative;--radix-scroll-area-corner-width:0px;--radix-scroll-area-corner-height:0px"><style>[data-radix-scroll-area-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-scroll-area-viewport]::-webkit-scrollbar{display:none}</style><div data-radix-scroll-area-viewport="" class="h-full w-full rounded-[inherit]" style="overflow-x:hidden;overflow-y:hidden"><div style="min-width:100%;display:table"><div class="flex flex-col gap-0 mt-3 pr-2 pb-6"><div class="flex flex-col first:mt-0 mt-6"><h4 class="mb-1.5 px-2 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/70">Getting Started</h4><div class="flex flex-col gap-0.5"><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/introduction"><span class="flex items-center">Introduction</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/stallion-hierarchy"><span class="flex items-center">Stallion Hierarchy</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/migrating-from-codepush"><span class="flex items-center">Migrating from Codepush</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/expo-integration-with-stallion"><span class="flex items-center">Expo Integration</span></a></div></div></div><div class="flex flex-col first:mt-0 mt-6"><h4 class="mb-1.5 px-2 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/70">Stallion SDK</h4><div class="flex flex-col gap-0.5"><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] transition-colors hover:bg-muted/60 hover:text-foreground bg-muted font-medium text-foreground" href="/learn/docs/sdk/installation"><span class="flex items-center">Installation</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/sdk/production-usage"><span class="flex items-center">Production Usage</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/sdk/js-update-api"><span class="flex items-center">JS update API</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/sdk/stallion-testing"><span class="flex items-center">Testing framework</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/sdk/distribution"><span class="flex items-center">Distribution</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/sdk/api-reference"><span class="flex items-center">API Reference</span></a></div></div></div><div class="flex flex-col first:mt-0 mt-6"><h4 class="mb-1.5 px-2 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/70">Stallion CLI</h4><div class="flex flex-col gap-0.5"><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/cli/installation"><span class="flex items-center">CLI Installation</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/cli/usage-api-reference"><span class="flex items-center">Publish Bundle API Reference</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/cli/release-bundle-api-reference"><span class="flex items-center">Release Bundle API Reference</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/cli/update-release-api-reference"><span class="flex items-center">Update Release API Reference</span></a></div><div class="flex flex-col"><div data-state="closed"><button type="button" aria-controls="radix-:R2osmu9lb:" aria-expanded="false" data-state="closed" class="w-full"><div class="flex items-center justify-between gap-1 rounded-md px-2 py-1.5 transition-colors hover:bg-muted/60"><span class="text-start text-[13.5px] font-medium text-foreground
1/80">Account &amp; Context Commands<span class="ml-2 rounded-md px-1.5 py-0.5 align-middle text-[10px] font-normal text-white bg-blue-500 dark:bg-blue-700">New</span></span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-right h-3.5 w-3.5 shrink-0 text-muted-foreground transition-transform"><path d="m9 18 6-6-6-6"></path></svg></div></button><div data-state="closed" id="radix-:R2osmu9lb:" hidden=""></div></div></div><div class="flex flex-col"><div data-state="closed"><button type="button" aria-controls="radix-:R38smu9lb:" aria-expanded="false" data-state="closed" class="w-full"><div class="flex items-center justify-between gap-1 rounded-md px-2 py-1.5 transition-colors hover:bg-muted/60"><span class="text-start text-[13.5px] font-medium text-foreground/80">List Commands<span class="ml-2 rounded-md px-1.5 py-0.5 align-middle text-[10px] font-normal text-white bg-blue-500 dark:bg-blue-700">New</span></span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-right h-3.5 w-3.5 shrink-0 text-muted-foreground transition-transform"><path d="m9 18 6-6-6-6"></path></svg></div></button><div data-state="closed" id="radix-:R38smu9lb:" hidden=""></div></div></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/cli/ci-automation-json-output"><span class="flex items-center">CI Automation &amp; JSON Output<span class="ml-2 rounded-md px-1.5 py-0.5 align-middle text-[10px] font-normal text-white bg-blue-500 dark:bg-blue-700">New</span></span></a></div><div class="flex flex-col"><div data-state="closed"><button type="button" aria-controls="radix-:R48smu9lb:" aria-expanded="false" data-state="closed" class="w-full"><div class="flex items-center justify-between gap-1 rounded-md px-2 py-1.5 transition-colors hover:bg-muted/60"><span class="text-start text-[13.5px] font-medium text-foreground/80">v2.0.2 &amp; Below (Deprecated)</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-right h-3.5 w-3.5 shrink-0 text-muted-foreground transition-transform"><path d="m9 18 6-6-6-6"></path></svg></div></button><div data-state="closed" id="radix-:R48smu9lb:" hidden=""></div></div></div></div></div><div class="flex flex-col first:mt-0 mt-6"><h4 class="mb-1.5 px-2 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/70">MCP Server<span class="ml-2 rounded-md px-1.5 py-0.5 align-middle text-[10px] font-normal text-white bg-amber-500 dark:bg-amber-600">Beta</span></h4><div class="flex flex-col gap-0.5"><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/mcp/overview"><span class="flex items-center">Overview</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/mcp/connect"><span class="flex items-center">Connecting Clients</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/mcp/tools"><span class="flex items-center">Tools Reference</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/mcp/security"><span class="flex items-center">Security</span></a></div></div></div><div class="flex flex-col first:mt-0 mt-6"><h4 class="mb-1.5 px-2 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground
1/70">Patch Updates</h4><div class="flex flex-col gap-0.5"><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/patch-updates/benefits"><span class="flex items-center">Benefits</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/patch-updates/how-it-works"><span class="flex items-center">How It Works</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/patch-updates/getting-started"><span class="flex items-center">Getting Started</span></a></div></div></div><div class="flex flex-col first:mt-0 mt-6"><h4 class="mb-1.5 px-2 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/70">Releasing &amp; Rollout</h4><div class="flex flex-col gap-0.5"><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/phased-rollout"><span class="flex items-center">Phased Rollout</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/codepush-mandatory-updates"><span class="flex items-center">Codepush Mandatory Updates</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/release-automation"><span class="flex items-center">Release Automation</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/beta-testing"><span class="flex items-center">Beta Testing</span></a></div><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/handling-multiple-environments"><span class="flex items-center">Handling Multiple Environments</span></a></div></div></div><div class="flex flex-col first:mt-0 mt-6"><h4 class="mb-1.5 px-2 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/70">Security &amp; SSO</h4><div class="flex flex-col gap-0.5"><div class="flex flex-col"><a class="block rounded-md px-2 py-1.5 text-[13.5px] text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground" href="/learn/docs/bundle-signing"><span class="flex items-center">Bundle Signing</span></a></div><div class="flex flex-col"><div data-state="closed"><button type="button" aria-controls="radix-:R19smu9lb:" aria-expanded="false" data-state="closed" class="w-full"><div class="flex items-center justify-between gap-1 rounded-md px-2 py-1.5 transition-colors hover:bg-muted/60"><span class="text-start text-[13.5px] font-medium text-foreground/80">SSO Integration</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-right h-3.5 w-3.5 shrink-0 text-muted-foreground transition-transform"><path d="m9 18 6-6-6-6"></path></svg></div></button><div data-state="closed" id="radix-:R19smu9lb:" hidden=""></div></div></div></div></div><div class="flex flex-col first:mt-0 mt-6"><h4 class="mb-1.5 px-2 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/70">Monitoring &amp; Troubleshooting</h4><div class="flex flex-col gap-0.5"><div class="flex flex-col"><div data-state="closed"><button type="button" aria-controls="radix-:Rq4mu9lb:" aria-expanded="false" data-state="closed" class="w-full"><div class="flex items-center justify-between gap-1 rounded-md px-2 py-1.5 transition-colors hover:bg-muted/60"><span class="text-start text-[13.5px] font-medium text-foreground
1/80">Uploading Source Maps</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-right h-3.5 w-3.5 shrink-0 text-muted-foreground transition-transform"><path d="m9 18 6-6-6-6"></path></svg></div></button><div data-state="closed" id="radix-:Rq4mu9lb:" hidden=""></div></div></div><div class="flex flex-col"><div data-state="closed"><button type="button" aria-controls="radix-:R1a4mu9lb:" aria-expanded="false" data-state="closed" class="w-full"><div class="flex items-center justify-between gap-1 rounded-md px-2 py-1.5 transition-colors hover:bg-muted/60"><span class="text-start text-[13.5px] font-medium text-foreground/80">Troubleshooting</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-right h-3.5 w-3.5 shrink-0 text-muted-foreground transition-transform"><path d="m9 18 6-6-6-6"></path></svg></div></button><div data-state="closed" id="radix-:R1a4mu9lb:" hidden=""></div></div></div></div></div></div></div></div></div></aside><div class="flex-[5.25]">
1<script type="application/ld+json">{"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Docs","item":"https://stalliontech.io/learn/docs/introduction"},{"@type":"ListItem","position":2,"name":"Sdk","item":"https://stalliontech.io/learn/docs/sdk"},{"@type":"ListItem","position":3,"name":"Installation","item":"https://stalliontech.io/learn/docs/sdk/installation"}]}</script>
1<script type="application/ld+json">{"@context":"https://schema.org","@type":"HowTo","name":"Installation","description":"React Native Stallion installation guide - Get started with OTA updates in 5 easy steps. Install SDK and CLI for React Native apps. Complete setup instructions.","step":[{"@type":"HowToStep","position":1,"name":"Step 1: Install the React Native Stallion SDK and CLI","text":"Step 1: Install the React Native Stallion SDK and CLI"},{"@type":"HowToStep","position":2,"name":"Step 2: Native Installation","text":"Step 2: Native Installation"},{"@type":"HowToStep","position":3,"name":"Step 3: Add Stallion bundle support in Android and iOS projects","text":"Step 3: Add Stallion bundle support in Android and iOS projects"},{"@type":"HowToStep","position":4,"name":"Step 4: Add ProjectId & AppToken in native","text":"Step 4: Add ProjectId & AppToken in native"},{"@type":"HowToStep","position":5,"name":"Step 5: Import and add Stallion as HOC in App.js","text":"Step 5: Import and add Stallion as HOC in App.js"}]}</script>
1<div class="flex items-start gap-10"><div class="flex-[4.5] py-10"><div class="flex items-center justify-between gap-4"><div class="pb-5"><nav aria-label="breadcrumb"><ol class="flex flex-wrap items-center gap-1.5 break-words text-sm text-muted-foreground sm:gap-2.5"><li class="inline-flex items-center gap-1.5"><a class="transition-colors hover:text-foreground" href="/learn/docs/introduction">Docs</a></li><li role="presentation" aria-hidden="true" class="[&amp;&gt;svg]:size-3.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-right"><path d="m9 18 6-6-6-6"></path></svg></li><li class="inline-flex items-center gap-1.5"><a class="transition-colors hover:text-foreground" href="/learn/docs/sdk">Sdk</a></li><li role="presentation" aria-hidden="true" class="[&amp;&gt;svg]:size-3.5"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-right"><path d="m9 18 6-6-6-6"></path></svg></li><li class="inline-flex items-center gap-1.5"><span role="link" aria-disabled="true" aria-current="page" class="font-normal text-foreground">Installation</span></li></ol></nav></div><div class="inline-flex items-stretch rounded-lg border bg-background shadow-sm"><button type="button" class="flex items-center gap-1.5 rounded-l-lg px-3 py-1.5 text-sm font-medium text-foreground/80 hover:bg-muted transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy h-4 w-4"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg>Copy page</button><button type="button" aria-label="Page options" class="flex items-center rounded-r-lg border-l px-1.5 text-foreground/70 hover:bg-muted transition-colors" id="radix-:Rabnrqu9lb:" aria-haspopup="menu" aria-expanded="false" data-state="closed"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down h-4 w-4"><path d="m6 9 6 6 6-6"></path></svg></button></div></div><div class="prose sm:prose-base prose-sm prose-zinc dark:prose-invert prose-code:font-normal prose-code:font-code dark:prose-code:bg-stone-900/25 prose-code:bg-stone-50 prose-pre:bg-background prose-headings:scroll-m-20 w-[85vw] sm:w-full sm:mx-auto prose-code:text-sm prose-code:leading-6 dark:prose-code:text-white prose-code:text-stone-800 prose-code:p-[0.085rem]  prose-code:rounded-md prose-code:border pt-2 !min-w-full prose-img:rounded-md prose-img:border prose-code:before:content-none prose-code:after:content-none prose-code:px-1.5 prose-code:overflow-x-auto !max-w-[500px] prose-img:my-3 prose-h2:my-4 prose-h2:mt-8 prose-code:break-all"><h1 class="sm:text-3xl text-2xl !-mt-0.5">Installation</h1><p class="-mt-4 text-muted-foreground sm:text-[16.5px] text-[14.5px]">React Native Stallion installation guide - Get started with OTA updates in 5 easy steps. Install SDK and CLI for React Native apps. Complete setup instructions.</p><div><p>Setting up React Native Stallion is straight forward, just install the CLI and SDK and start using. React Native Stallion requires <a target="_blank" rel="noopener noreferrer" href="https://reactnative.dev/versions/">react-native</a> version 0.69 or higher for optimal performance.</p>
2<iframe width="100%" height="400" src="https://www.youtube.com/embed/BZAKdfpn1Ug" title="Stallion Introduction" frameBorder="0" style="border-radius:8px" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen=""></iframe>
3<h3 id="sdk-installation"><a aria-hidden="true" tabindex="-1" target="_blank" rel="noopener noreferrer" href="#sdk-installation"><span class="icon icon-link"></span></a>SDK Installation</h3>
4<p>To get started, install the SDK using npm or yarn.</p>
5<div class="flex flex-col"><div class="border-l pl-9 ml-3 relative pb-5"><div class="bg-muted w-8 h-8 text-xs font-medium rounded-md border flex items-center justify-center absolute -left-4 font-code">1</div><div class="pt-0.5"><h4 class="mt-0">Step 1: Install the React Native Stallion SDK and CLI</h4><div><p>Begin by installing SDK in your react-native project:</p><div class="my-5 relative"><div class="absolute top-3 right-2.5 z-10 sm:block hidden"><button class="inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-secondary/80 h-7 rounded-md px-2 border"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy w-3 h-3"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg></button></div><div class="relative"><pre class="language-bash"><code class="language-bash code-highlight"><span class="code-line"><span class="token function">npm</span> i react-native-stallion
6</span></code></pre></div></div><p>or if you are using yarn then</p><div class="my-5 relative"><div class="absolute top-3 right-2.5 z-10 sm:block hidden"><button class="inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-secondary/80 h-7 rounded-md px-2 border"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy w-3 h-3"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg></button></div><div class="relative"><pre class="language-bash"><code class="language-bash code-highlight"><span class="code-line"><span class="token function">yarn</span> <span class="token function">add</span> react-native-stallion
7</span></code></pre></div></div><p>for steps to install the CLI checkout <a target="_blank" rel="noopener noreferrer" href="/learn/docs/cli/installation#installation">CLI Installation Docs</a></p></div></div></div><div class="border-l pl-9 ml-3 relative pb-5"><div class="bg-muted w-8 h-8 text-xs font-medium rounded-md border flex items-center justify-center absolute -left-4 font-code">
72</div><div class="pt-0.5"><h4 class="mt-0">Step 2: Native Installation</h4><div><p>After installing the SDK, you need to install pods for iOS and gradle sync android project:</p><div class="my-5 relative"><div class="absolute top-3 right-2.5 z-10 sm:block hidden"><button class="inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-secondary/80 h-7 rounded-md px-2 border"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy w-3 h-3"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg></button></div><div class="relative"><pre class="language-plaintext"><code class="language-plaintext code-highlight"><span class="code-line">npx pod-install
8</span></code></pre></div></div></div></div></div><div class="border-l pl-9 ml-3 relative pb-5"><div class="bg-muted w-8 h-8 text-xs font-medium rounded-md border flex items-center justify-center absolute -left-4 font-code">3</div><div class="pt-0.5"><h4 class="mt-0">Step 3: Add Stallion bundle support in Android and iOS projects</h4><div><ul>
9<li>
10<p><strong>Android</strong> - Inside <code>MainApplication.java</code>, override and implement <code>getJSBundleFile</code> method :</p>
11<div class="rehype-code-title"><i class="devicon-java-plain text-[17px] code-icon"></i>MainApplication.java</div><div class="my-5 relative"><div class="absolute top-3 right-2.5 z-10 sm:block hidden"><button class="inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-secondary/80 h-7 rounded-md px-2 border"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy w-3 h-3"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg></button></div><div class="relative"><pre class="language-java"><code class="language-java code-highlight"><span class="code-line"><span class="token comment">// ...other imports</span>
12</span><span class="code-line"><span class="token keyword">import</span> <span class="token import"><span class="token namespace">com<span class="token punctuation">.</span>stallion<span class="token punctuation">.</span></span><span class="token class-name">Stallion</span></span><span class="token punctuation">;</span>
13</span><span class="code-line">
14</span><span class="code-line"><span class="token keyword">public</span> <span class="token keyword">class</span> <span class="token class-name">MainApplication</span> <span class="token keyword">extends</span> <span class="token class-name">Application</span> <span class="token keyword">implements</span> <span class="token class-name">ReactApplication</span> <span class="token punctuation">{</span>
15</span><span class="code-line">  <span class="token comment">// ...rest of the class</span>
16</span><span class="code-line">  <span class="token annotation punctuation">@Override</span>
17</span><span class="code-line">  <span class="token keyword">protected</span> <span class="token class-name">String</span> <span class="token function">getJSBundleFile</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
18</span><span class="code-line">      <span class="token keyword">return</span> <span class="token class-name">Stallion</span><span class="token punctuation">.</span><span class="token function">getJSBundleFile</span><span class="token punctuation">(</span><span class="token function">getApplicationContext</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
19</span><span class="code-line">  <span class="token punctuation">}</span>
20</span><span class="code-line"><span class="token punctuation">}</span>
21</span></code></pre></div></div>
22<p><strong>If running on latest version of react-native (&gt;v0.76)</strong> <br/>
23<!-- -->Inside <code>MainApplication.kt</code> file edit the <code>reactNativeHost</code> method:</p>
24<div class="rehype-code-title"><i class="devicon-kotlin-plain text-[17px] code-icon"></i>MainApplication.kt</div><div class="my-5 relative"><div class="absolute top-3 right-2.5 z-10 sm:block hidden"><button class="inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-secondary/80 h-7 rounded-md px-2 border"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy w-3 h-3"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg></button></div><div class="relative"><pre class="language-kotlin"><code class="language-kotlin code-highlight"><span class="code-line"><span class="token comment">// ...other imports</span>
25</span><span class="code-line"><span class="token keyword">
25import</span> com<span class="token punctuation">.</span>stallion<span class="token punctuation">.</span>Stallion
26</span><span class="code-line">
27</span><span class="code-line"><span class="token comment">// ...other functions</span>
28</span><span class="code-line"><span class="token keyword">override</span> <span class="token keyword">val</span> reactNativeHost<span class="token operator">:</span> ReactNativeHost <span class="token operator">=</span>
29</span><span class="code-line">  <span class="token keyword">object</span> <span class="token operator">:</span> <span class="token function">DefaultReactNativeHost</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
30</span><span class="code-line">    <span class="token keyword">override</span> <span class="token keyword">fun</span> <span class="token function">getPackages</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token operator">:</span> List<span class="token operator">&lt;</span>ReactPackage<span class="token operator">&gt;</span> <span class="token operator">=</span>
31</span><span class="code-line">      <span class="token comment">//other methods...</span>
32</span><span class="code-line">
33</span><span class="code-line">      <span class="token keyword">override</span> <span class="token keyword">fun</span> <span class="token function">getJSBundleFile</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token operator">:</span> String<span class="token operator">?</span> <span class="token punctuation">{</span>
34</span><span class="code-line">          <span class="token keyword">return</span> Stallion<span class="token punctuation">.</span><span class="token function">getJSBundleFile</span><span class="token punctuation">(</span>applicationContext<span class="token punctuation">)</span>
35</span><span class="code-line">      <span class="token punctuation">}</span>
36</span><span class="code-line">  <span class="token punctuation">}</span>
37</span></code></pre></div></div>
38<p><strong>If running on React Native 82 and above</strong> <br/>
39<!-- -->Inside <code>MainApplication.kt</code> file, override the <code>reactHost</code> property:</p>
40<div class="rehype-code-title"><i class="devicon-kotlin-plain text-[17px] code-icon"></i>MainApplication.kt</div><div class="my-5 relative"><div class="absolute top-3 right-2.5 z-10 sm:block hidden"><button class="inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-secondary/80 h-7 rounded-md px-2 border"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy w-3 h-3"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg></button></div><div class="relative"><pre class="language-kotlin"><code class="language-kotlin code-highlight"><span class="code-line"><span class="token comment">// ...other imports</span>
41</span><span class="code-line"><span class="token keyword">import</span> com<span class="token punctuation">.</span>facebook<span class="token punctuation">.</span>react<span class="token punctuation">.</span>ReactHost
42</span><span class="code-line"><span class="token keyword">import</span> com<span class="token punctuation">.</span>facebook<span class="token punctuation">.</span>react<span class="token punctuation">.</span>defaults<span class="token punctuation">.</span>DefaultReactHost<span class="token punctuation">.</span>getDefaultReactHost
43</span><span class="code-line"><span class="token keyword">import</span> com<span class="token punctuation">.</span>stallion<span class="token punctuation">.</span>Stallion
44</span><span class="code-line">
45</span><span class="code-line"><span class="token keyword">class</span> MainApplication <span class="token operator">:</span> <span class="token function">Application</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">,</span> ReactApplication <span class="token punctuation">{</span>
46</span><span class="code-line">  <span class="token keyword">
46override</span> <span class="token keyword">val</span> reactHost<span class="token operator">:</span> ReactHost <span class="token keyword">by</span> lazy <span class="token punctuation">{</span>
47</span><span class="code-line">    <span class="token function">getDefaultReactHost</span><span class="token punctuation">(</span>
48</span><span class="code-line">      context <span class="token operator">=</span> applicationContext<span class="token punctuation">,</span>
49</span><span class="code-line">      packageList <span class="token operator">=</span> <span class="token function">PackageList</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">)</span><span class="token punctuation">.</span>packages<span class="token punctuation">,</span>
50</span><span class="code-line">      jsBundleFilePath <span class="token operator">=</span> Stallion<span class="token punctuation">.</span><span class="token function">getJSBundleFile</span><span class="token punctuation">(</span>applicationContext<span class="token punctuation">)</span>
51</span><span class="code-line">    <span class="token punctuation">)</span>
52</span><span class="code-line">  <span class="token punctuation">}</span>
53</span><span class="code-line"><span class="token punctuation">}</span>
54</span></code></pre></div></div>
55</li>
56<li>
57<p><strong>iOS</strong> - Inside <code>ios/AppDelegate.mm</code> file edit <code>bundleURL</code> method</p>
58<div class="my-5 relative"><div class="absolute top-3 right-2.5 z-10 sm:block hidden"><button class="inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-secondary/80 h-7 rounded-md px-2 border"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy w-3 h-3"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg></button></div><div class="relative"><pre class="language-objectivec"><code class="language-objectivec code-highlight"><span class="code-line"><span class="token comment">// ...other imports</span>
59</span><span class="code-line"><span class="token macro property"><span class="token directive-hash">#</span><span class="token directive keyword">import</span> <span class="token string">&quot;StallionModule.h&quot;</span></span>
60</span><span class="code-line">
61</span><span class="code-line"><span class="token keyword">@implementation</span> AppDelegate
62</span><span class="code-line"><span class="token comment">// ...other implemetations</span>
63</span><span class="code-line"><span class="token operator">-</span> <span class="token punctuation">(</span>NSURL <span class="token operator">*</span><span class="token punctuation">)</span>bundleURL
64</span><span class="code-line">  <span class="token punctuation">{</span>
65</span><span class="code-line">    <span class="token macro property"><span class="token directive-hash">#</span><span class="token directive keyword">if</span> <span class="token expression">DEBUG</span></span>
66</span><span class="code-line">      <span class="token keyword">return</span> <span class="token punctuation">[</span><span class="token punctuation">[</span>RCTBundleURLProvider sharedSettings<span class="token punctuation">]</span> jsBundleURLForBundleRoot<span class="token punctuation">:</span><span class="token string">@&quot;index&quot;</span><span class="token punctuation">]</span><span class="token punctuation">;</span>
67</span><span class="code-line">    <span class="token macro property"><span class="token directive-hash">#</span><span class="token directive keyword">else</span></span>
68</span><span class="code-line">      <span class="token keyword">return</span> <span class="token punctuation">[</span>StallionModule getBundleURL<span class="token punctuation">]</span><span class="token punctuation">;</span>
69</span><span class="code-line">    <span class="token macro property"><span class="token directive-hash">#</span><span class="token directive keyword">endif</span></span>
70</span><span class="code-line">  <span class="token punctuation">}</span>
71</span></code></pre></div></div>
72<p><strong>If running on latest version of react-native (&gt;v0.76)</strong> <br/>
73<!-- -->Inside <code>ios/AppDelegate.swift</code> file edit the <code>bundleURL</code> method:</p>
74<div class="my-5 relative"><div class="absolute top-3 right-2.5 z-10 sm:block hidden"><button class="inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-secondary/80 h-7 rounded-md px-2 border"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy w-3 h-3"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg></button></div><div class="relative"><pre class="language-swift"><code class="language-swift code-highlight"><span class="code-line"><span class="token comment">// ...other imports</span>
75</span><span class="code-line"><span class="token keyword">
75import</span> react_native_stallion
76</span><span class="code-line">
77</span><span class="code-line"><span class="token comment">// ...other functions</span>
78</span><span class="code-line"><span class="token keyword">override</span> <span class="token keyword">func</span> <span class="token function-definition function">bundleURL</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">-&gt;</span> <span class="token constant">URL</span><span class="token operator">?</span> <span class="token punctuation">{</span>
79</span><span class="code-line">    <span class="token directive property"><span class="token directive-name">#if</span> DEBUG</span>
80</span><span class="code-line">        <span class="token class-name">RCTBundleURLProvider</span><span class="token punctuation">.</span><span class="token function">sharedSettings</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">jsBundleURL</span><span class="token punctuation">(</span>forBundleRoot<span class="token punctuation">:</span> <span class="token string-literal"><span class="token string">&quot;index&quot;</span></span><span class="token punctuation">)</span>
81</span><span class="code-line">    <span class="token directive property"><span class="token directive-name">#else</span></span>
82</span><span class="code-line">        <span class="token class-name">StallionModule</span><span class="token punctuation">.</span><span class="token function">getBundleURL</span><span class="token punctuation">(</span><span class="token punctuation">)</span>
83</span><span class="code-line">    <span class="token directive property"><span class="token directive-name">#endif</span></span>
84</span><span class="code-line"><span class="token punctuation">}</span>
85</span></code></pre></div></div>
86</li>
87</ul></div></div></div><div class="border-l pl-9 ml-3 relative pb-5"><div class="bg-muted w-8 h-8 text-xs font-medium rounded-md border flex items-center justify-center absolute -left-4 font-code">4</div><div class="pt-0.5"><h4 class="mt-0">Step 4: Add ProjectId &amp; AppToken in native</h4><div><ul>
88<li>
89<p><strong>Get projectID from Stallion Dashboard :</strong>
90On project info page, copy project id.
91<img alt="Alt text for the image" loading="lazy" width="800" height="350" decoding="async" data-nimg="1" style="color:transparent" srcSet="/learn/_next/image?url=https%3A%2F%2Fassets.stalliontech.io%2Fproject_id.png&amp;w=828&amp;q=40 1x, /learn/_next/image?url=https%3A%2F%2Fassets.stalliontech.io%2Fproject_id.png&amp;w=1920&amp;q=40 2x" src="/learn/_next/image?url=https%3A%2F%2Fassets.stalliontech.io%2Fproject_id.png&amp;w=1920&amp;q=40"/></p>
92</li>
93<li>
94<p><strong>Generate App Token :</strong>
95Navigate to <code>Project &gt; Project Settings &gt; Access Tokens</code>, and select <code>Generate</code> or <code>Regenerate App</code> Token to create a new token.
96<img alt="Alt text for the image" loading="lazy" width="800" height="350" decoding="async" data-nimg="1" style="color:transparent" srcSet="/learn/_next/image?url=https%3A%2F%2Fassets.stalliontech.io%2Fgen_app_token.png&amp;w=828&amp;q=40 1x, /learn/_next/image?url=https%3A%2F%2Fassets.stalliontech.io%2Fgen_app_token.png&amp;w=1920&amp;q=40 2x" src="/learn/_next/image?url=https%3A%2F%2Fassets.stalliontech.io%2Fgen_app_token.png&amp;w=1920&amp;q=40"/></p>
97</li>
98</ul><p>Add <code>StallionProjectId</code> &amp; <code>StallionAppToken</code> as shown below -</p><ul>
99<li>
100<p><strong>iOS</strong>: Add the copied App Token and projectId to <code>info.plist</code></p>
101<div class="my-5 relative"><div class="absolute top-3 right-2.5 z-10 sm:block hidden"><button class="inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-secondary/80 h-7 rounded-md px-2 border"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy w-3 h-3"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg></button></div><div class="relative"><pre class="language-xml"><code class="language-xml code-highlight"><span class="code-line"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>plist</span> <span class="token attr-name">version</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>1.0<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
102</span><span class="code-line">  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>dict</span><span class="token punctuation">&gt;</span></span>
103</span><span class="code-line">    <span class="token comment">&lt;!-- ...other configs... --&gt;</span>
104</span><span class="code-line">    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>key</span><span class="token punctuation">&gt;</span></span>StallionProjectId<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>key</span><span class="token punctuation">&gt;</span></span>
105</span><span class="code-line">    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>string</span><span class="token punctuation">&gt;</span></span>66ed03380eb95c9c316256d3<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>string</span><span class="token punctuation">&gt;</span></span>
106</span><span class="code-line">    <span class="token comment">&lt;!-- make sure app token starts with spb_... and is 46 characters long --&gt;</span>
107</span><span class="code-line">    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>key</span><span class="token punctuation">&gt;</span></span>StallionAppToken<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>key</span><span class="token punctuation">&gt;</span></span>
108</span><span class="code-line">    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>string</span><span class="token punctuation">&gt;</span></span>
108spb_FTLx5umZgKLTEyiMNf9-81BgANTOvx7pNhA-gFXbg9<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>string</span><span class="token punctuation">&gt;</span></span>
109</span><span class="code-line">    <span class="token comment">&lt;!-- ...other configs... --&gt;</span>
110</span><span class="code-line">  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>dict</span><span class="token punctuation">&gt;</span></span>
111</span><span class="code-line"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>plist</span><span class="token punctuation">&gt;</span></span>
112</span></code></pre></div></div>
113<p><img alt="Alt text for the image" loading="lazy" width="800" height="350" decoding="async" data-nimg="1" style="color:transparent" srcSet="/learn/_next/image?url=https%3A%2F%2Fassets.stalliontech.io%2Fios_info_plist.png&amp;w=828&amp;q=40 1x, /learn/_next/image?url=https%3A%2F%2Fassets.stalliontech.io%2Fios_info_plist.png&amp;w=1920&amp;q=40 2x" src="/learn/_next/image?url=https%3A%2F%2Fassets.stalliontech.io%2Fios_info_plist.png&amp;w=1920&amp;q=40"/></p>
114</li>
115<li>
116<p><strong>android</strong>: Add the copied App Token and projectId to <code>strings.xml</code></p>
117<div class="my-5 relative"><div class="absolute top-3 right-2.5 z-10 sm:block hidden"><button class="inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-secondary/80 h-7 rounded-md px-2 border"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy w-3 h-3"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg></button></div><div class="relative"><pre class="language-xml"><code class="language-xml code-highlight"><span class="code-line"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>resources</span><span class="token punctuation">&gt;</span></span>
118</span><span class="code-line">  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>string</span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>app_name<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>my_app<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>string</span><span class="token punctuation">&gt;</span></span>
119</span><span class="code-line">  <span class="token comment">&lt;!-- make sure app token starts with spb_... and is 46 characters long --&gt;</span>
120</span><span class="code-line">  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>string</span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>StallionProjectId<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>66ed03380eb95c9c316256d3<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>string</span><span class="token punctuation">&gt;</span></span>
121</span><span class="code-line">  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>string</span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>StallionAppToken<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
121spb_FTLx5umZgKLTEyiMNf9-81BgANTOvx7pNhA-gFXbg9<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>string</span><span class="token punctuation">&gt;</span></span>
122</span><span class="code-line"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>resources</span><span class="token punctuation">&gt;</span></span>
123</span></code></pre></div></div>
124<p><img alt="Alt text for the image" loading="lazy" width="800" height="350" decoding="async" data-nimg="1" style="color:transparent" srcSet="/learn/_next/image?url=https%3A%2F%2Fassets.stalliontech.io%2Fandroid_strings_xml.png&amp;w=828&amp;q=40 1x, /learn/_next/image?url=https%3A%2F%2Fassets.stalliontech.io%2Fandroid_strings_xml.png&amp;w=1920&amp;q=40 2x" src="/learn/_next/image?url=https%3A%2F%2Fassets.stalliontech.io%2Fandroid_strings_xml.png&amp;w=1920&amp;q=40"/></p>
125</li>
126</ul></div></div></div><div class="border-l pl-9 ml-3 relative"><div class="bg-muted w-8 h-8 text-xs font-medium rounded-md border flex items-center justify-center absolute -left-4 font-code">5</div><div class="pt-0.5"><h4 class="mt-0">Step 5: Import and add Stallion as HOC in App.js</h4><div><ul>
127<li>Import <code>withStallion</code> HOC<!-- -->
128<div class="my-5 relative"><div class="absolute top-3 right-2.5 z-10 sm:block hidden"><button class="inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-secondary/80 h-7 rounded-md px-2 border"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy w-3 h-3"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg></button></div><div class="relative"><pre class="language-javascript"><code class="language-javascript code-highlight"><span class="code-line"><span class="token keyword module">import</span> <span class="token imports"><span class="token punctuation">{</span> withStallion <span class="token punctuation">}</span></span> <span class="token keyword module">from</span> <span class="token string">&#x27;react-native-stallion&#x27;</span><span class="token punctuation">;</span>
129</span></code></pre></div></div>
130</li>
131<li>Wrap root component (generally App.tsx or App.js) with HOC<!-- -->
132<div class="my-5 relative"><div class="absolute top-3 right-2.5 z-10 sm:block hidden"><button class="inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-secondary/80 h-7 rounded-md px-2 border"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy w-3 h-3"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg></button></div><div class="relative"><pre class="language-javascript"><code class="language-javascript code-highlight"><span class="code-line"><span class="token keyword module">export</span> <span class="token keyword module">default</span> <span class="token function">withStallion</span><span class="token punctuation">(</span><span class="token maybe-class-name">App</span><span class="token punctuation">)</span>
133</span></code></pre></div></div>
134</li>
135</ul></div></div></div></div>
136<p>With this setup, you’ll have installed Stallion. I next section we will see how to use Stallion to deploy bundles and get realtime updates.</p>
137<div class="border rounded-md px-5 pb-0.5 mt-5 mb-7 text-sm tracking-wide dark:bg-yellow-950 bg-orange-100 border-orange-200 dark:border-yellow-900"><p class="font-bold -mb-2.5">Remember<!-- -->:</p> <p>After installing Stallion in your React Native app, make sure to publish a
138build (APK or TestFlight) with Stallion fully integrated. This is essential to
139test and verify that OTA updates are being correctly installed via Stallion.
140Note: If you&#x27;re running your app in development mode connected to the Metro
141bundler, Stallion&#x27;
141s OTA changes will not be applied. To properly test OTA
142updates, you must use a published app build.</p></div></div><div class="grid grid-cols-2 flex-grow sm:py-10 py-7 gap-3"><div><a class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border border-input bg-background hover:bg-accent hover:text-accent-foreground h-10 px-4 py-2 no-underline w-full flex flex-col pl-3 !py-8 !items-start" href="/learn/docs/expo-integration-with-stallion"><span class="flex items-center text-muted-foreground text-xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-left w-[1rem] h-[1rem] mr-1"><path d="m15 18-6-6 6-6"></path></svg>Previous</span><span class="mt-1 ml-1">Expo Integration</span></a></div><div><a class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border border-input bg-background hover:bg-accent hover:text-accent-foreground h-10 px-4 py-2 no-underline w-full flex flex-col pr-3 !py-8 !items-end" href="/learn/docs/sdk/production-usage"><span class="flex items-center text-muted-foreground text-xs">Next<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-right w-[1rem] h-[1rem] ml-1"><path d="m9 18 6-6-6-6"></path></svg></span><span class="mt-1 mr-1">Production Usage</span></a></div></div></div></div><div class="lg:flex hidden toc flex-[1.5] min-w-[238px] py-9 sticky top-16 h-[96.95vh]"><div class="flex flex-col gap-3 w-full pl-2"><h3 class="font-medium text-sm">On this page</h3><div dir="ltr" class="relative overflow-hidden pb-2 pt-0.5 overflow-y-auto" style="position:relative;--radix-scroll-area-corner-width:0px;--radix-scroll-area-corner-height:0px"><style>[data-radix-scroll-area-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-scroll-area-viewport]::-webkit-scrollbar{display:none}</style><div data-radix-scroll-area-viewport="" class="h-full w-full rounded-[inherit]" style="overflow-x:hidden;overflow-y:hidden"><div style="min-width:100%;display:table"><div class="flex flex-col gap-2.5 text-sm dark:text-stone-300/85 text-stone-800 ml-0.5"><a class="pl-4" href="#sdk-installation">SDK Installation</a></div></div></div></div></div></div></div></div></div></main><footer class="border-t w-full h-16"><div class="container flex items-center sm:justify-between justify-center sm:gap-0 gap-4 h-full text-muted-foreground text-sm flex-wrap sm:py-0 py-3 max-sm:px-4"><div class="flex items-center gap-3"><p class="text-center">Copyright © 2026 Redhorse Technologies</p></div><div class="gap-4 items-center hidden md:flex"><a target="_blank" rel="noopener noreferrer" class="inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-foreground hover:bg-primary/90 h-9 rounded-md px-3" href="https://github.com/stallion-tech/react-native-stallion"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-github h-4 w-4"><path d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4"></path><path d="M9 18c-4.51 2-5-2-7-2"></path></svg>⭐ Star on GitHub</a><a class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border border-input bg-background hover:bg-accent hover:text-accent-foreground h-9 rounded-md px-3" href="https://www.linkedin.com/company/stalliontechnologies"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-linkedin h-4 w-4 mr-2 fill-current"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"></path><rect width="4" height="12" x="2" y="9"></rect><circle cx="4" cy="4" r="2"></circle></svg>Linkedin</a></div></div></footer></div><div aria-hidden="true" class="fixed inset-0 z-[100000] bg-black/60 transition-opacity duration-300 lg:hidden pointer-events-none opacity-0"></div><aside role="dialog" aria-label="Ask Stallion" aria-hidden="true" class="fixed inset-y-0 right-0 z-[100001] flex h-full w-full flex-col border-l border-border bg-background text-foreground shadow-2xl transition-transform duration-300 ease-in-out sm:w-[var(--asp-w,440px)] pointer-events-none translate-x-full"><div role="separator" aria-orientation="vertical" aria-label="Resize panel" class="group absolute inset-y-0 left-0 z-10 hidden w-1.5 cursor-col-resize sm:block"><div class="mx-auto h-full w-px bg-transparent transition-colors group-hover:bg-brand/60"></div></div><div class="flex h-16 shrink-0 items-center justify-between border-b border-border/60 px-4"><div class="flex items-center gap-3"><span class="flex items-center justify-center rounded-lg bg-brand text-brand-foreground shadow-sm size-9"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles size-4"><path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"></path><path d="M20 3v4"></path><path d="M22 5h-4"></path><path d="M4 17v2"></path><path d="M5 18H3"></path></svg></span><div class="leading-tight"><div class="flex items-center gap-1.5"><p class="text-sm font-semibold text-foreground">Ask Stallion</p><span class="rounded bg-brand/15 px-1 py-0.5 text-[9px] font-semibold uppercase leading-none tracking-wide text-brand-strong">beta</span></div><p class="text-xs text-muted-foreground">Answers about Stallion</p></div></div><div class="flex items-center gap-2"><button type="button" class="flex items-center gap-1.5 rounded-md border border-border px-2.5 py-1.5 text-xs font-medium text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-plus size-3.5"><path d="M5 12h14"></path><path d="M12 5v14"></path></svg>New</button><button type="button" aria-label="Close" class="flex size-8 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x size-4"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></button></div></div><div class="flex-1 overflow-y-auto px-4 py-5"><div class="flex flex-col"><h3 class="text-lg font-semibold text-foreground">Hey! What can I help you ship?</h3><p class="mt-2 text-sm leading-relaxed text-muted-foreground">Ask me anything about React Native Stallion — OTA updates, patch diffs, rollback, the CLI, pricing, migrating from CodePush, and more. Every answer links back to the docs.</p><p class="mb-2 mt-6 text-xs font-medium uppercase tracking-wide text-muted-foreground">Suggested questions</p><div class="flex flex-col gap-2"><button type="button" class="group flex items-center justify-between gap-3 rounded-lg border border-border bg-muted/30 px-3.5 py-2.5 text-left text-sm text-foreground transition-colors hover:bg-accent"><span>What are Patch Updates and how much smaller are they?</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-up size-3.5 shrink-0 rotate-45 text-muted-foreground transition-colors group-hover:text-brand-strong"><path d="m5 12 7-7 7 7"></path><path d="M12 19V5"></path></svg></button><button type="button" class="group flex items-center justify-between gap-3 rounded-lg border border-border bg-muted/30 px-3.5 py-2.5 text-left text-sm text-foreground transition-colors hover:bg-accent"><span>How much does Stallion cost for 250k users?</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-up size-3.5 shrink-0 rotate-45 text-muted-foreground transition-colors group-hover:text-brand-strong"><path d="m5 12 7-7 7 7"></path><path d="M12 19V5"></path></svg></button><button type="button" class="group flex items-center justify-between gap-3 rounded-lg border border-border bg-muted/30 px-3.5 py-2.5 text-left text-sm text-foreground transition-colors hover:bg-accent"><span>How do I migrate from CodePush?</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-up size-3.5 shrink-0 rotate-45 text-muted-foreground transition-colors group-hover:text-brand-strong"><path d="m5 12 7-7 7 7"></path><path d="M12 19V5"></path></svg></button><button type="button" class="group flex items-center justify-between gap-3 rounded-lg border border-border bg-muted/30 px-3.5 py-2.5 text-left text-sm text-foreground transition-colors hover:bg-accent"><span>How do I publish my first bundle with the CLI?</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-up size-3.5 shrink-0 rotate-45 text-muted-foreground transition-colors group-hover:text-brand-strong"><path d="m5 12 7-7 7 7"></path><path d="M12 19V5"></path></svg></button><button type="button" class="group flex items-center justify-between gap-3 rounded-lg border border-border bg-muted/30 px-3.5 py-2.5 text-left text-sm text-foreground transition-colors hover:bg-accent"><span>
142How does automatic rollback work?</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-up size-3.5 shrink-0 rotate-45 text-muted-foreground transition-colors group-hover:text-brand-strong"><path d="m5 12 7-7 7 7"></path><path d="M12 19V5"></path></svg></button></div></div><div></div></div><div class="border-t border-border/70 px-4 py-3"><form class="flex items-center gap-2 rounded-xl border border-border bg-muted/40 px-3 py-2 focus-within:border-brand/60"><input placeholder="Ask a follow-up..." class="flex-1 bg-transparent text-sm text-foreground placeholder:text-muted-foreground focus:outline-none" value=""/><button type="submit" disabled="" aria-label="Send" class="flex size-7 items-center justify-center rounded-md bg-brand text-brand-foreground transition-opacity disabled:opacity-40"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-up size-4"><path d="m5 12 7-7 7 7"></path><path d="M12 19V5"></path></svg></button></form><p class="mt-2 text-center text-[11px] text-muted-foreground/70">AI answers may be imperfect — always verify against the docs.</p></div></aside><button type="button" aria-label="Ask Stallion" class="group fixed bottom-6 right-6 z-40 flex items-center gap-2 rounded-full bg-brand py-3 pl-4 pr-5 text-sm font-semibold text-brand-foreground shadow-lg shadow-brand/30 transition-all duration-300 hover:scale-105 hover:shadow-[0_0_35px_hsl(var(--brand)/0.5)]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles size-4"><path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"></path><path d="M20 3v4"></path><path d="M22 5h-4"></path><path d="M4 17v2"></path><path d="M5 18H3"></path></svg>Ask Stallion</button><div class="fixed bottom-3 left-1/2 z-[100002] -translate-x-1/2"><div id="cf-turnstile"></div></div>
142<script src="/learn/_next/static/chunks/webpack-e44a3cf9c8845c8e.js" async=""></script>
142<script>(self.__next_f=self.__next_f||[]).push([0])</script>
142<script>self.__next_f.push([1,"5:\"$Sreact.fragment\"\n6:I[4159,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"583\",\"static/chunks/583-5f6d92491e21849f.js\",\"460\",\"static/chunks/460-c19bf6dfa8d62bcf.js\",\"473\",\"static/chunks/473-def3eddc7671c707.js\",\"177\",\"static/chunks/app/layout-23eab13111997091.js\"],\"ThemeProvider\"]\n7:I[1643,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"583\",\"static/chunks/583-5f6d92491e21849f.js\",\"460\",\"static/chunks/460-c19bf6dfa8d62bcf.js\",\"473\",\"static/chunks/473-def3eddc7671c707.js\",\"177\",\"static/chunks/app/layout-23eab13111997091.js\"],\"AskStallionProvider\"]\n8:I[2371,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"583\",\"static/chunks/583-5f6d92491e21849f.js\",\"460\",\"static/chunks/460-c19bf6dfa8d62bcf.js\",\"473\",\"static/chunks/473-def3eddc7671c707.js\",\"177\",\"static/chunks/app/layout-23eab13111997091.js\"],\"default\"]\n9:I[6456,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"583\",\"static/chunks/583-5f6d92491e21849f.js\",\"460\",\"static/chunks/460-c19bf6dfa8d62bcf.js\",\"473\",\"static/chunks/473-def3eddc7671c707.js\",\"177\",\"static/chunks/app/layout-23eab13111997091.js\"],\"default\"]\na:I[6870,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"583\",\""])</script>
142<script>self.__next_f.push([1,"static/chunks/583-5f6d92491e21849f.js\",\"460\",\"static/chunks/460-c19bf6dfa8d62bcf.js\",\"473\",\"static/chunks/473-def3eddc7671c707.js\",\"177\",\"static/chunks/app/layout-23eab13111997091.js\"],\"Sheet\"]\nb:I[6870,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"583\",\"static/chunks/583-5f6d92491e21849f.js\",\"460\",\"static/chunks/460-c19bf6dfa8d62bcf.js\",\"473\",\"static/chunks/473-def3eddc7671c707.js\",\"177\",\"static/chunks/app/layout-23eab13111997091.js\"],\"SheetTrigger\"]\nc:I[6870,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"583\",\"static/chunks/583-5f6d92491e21849f.js\",\"460\",\"static/chunks/460-c19bf6dfa8d62bcf.js\",\"473\",\"static/chunks/473-def3eddc7671c707.js\",\"177\",\"static/chunks/app/layout-23eab13111997091.js\"],\"SheetContent\"]\nd:I[7837,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"583\",\"static/chunks/583-5f6d92491e21849f.js\",\"460\",\"static/chunks/460-c19bf6dfa8d62bcf.js\",\"473\",\"static/chunks/473-def3eddc7671c707.js\",\"177\",\"static/chunks/app/layout-23eab13111997091.js\"],\"DialogTitle\"]\ne:I[6870,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"583\",\"static/chunks/583-5f6d92491e21849f.js\",\"460\",\"static/chunks/460-c19bf6dfa8d62bcf.js\",\"473\",\"static/chunks/473-def3eddc7671c707.js\",\"177\",\"static/chunks/app/layout-23eab13111997091.js\"],\"SheetHeader\"]\nf:I[6870,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/ch"])</script>
142<script>self.__next_f.push([1,"unks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"583\",\"static/chunks/583-5f6d92491e21849f.js\",\"460\",\"static/chunks/460-c19bf6dfa8d62bcf.js\",\"473\",\"static/chunks/473-def3eddc7671c707.js\",\"177\",\"static/chunks/app/layout-23eab13111997091.js\"],\"SheetClose\"]\n10:I[4839,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"140\",\"static/chunks/140-38b38c63288b6c5d.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-4f333ec4fedcfb8c.js\"],\"\"]\n11:I[7970,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"140\",\"static/chunks/140-38b38c63288b6c5d.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-4f333ec4fedcfb8c.js\"],\"Image\"]\n12:I[8447,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"583\",\"static/chunks/583-5f6d92491e21849f.js\",\"460\",\"static/chunks/460-c19bf6dfa8d62bcf.js\",\"473\",\"static/chunks/473-def3eddc7671c707.js\",\"177\",\"static/chunks/app/layout-23eab13111997091.js\"],\"default\"]\n13:I[17,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"583\",\"static/chunks/583-5f6d92491e21849f.js\",\"460\",\"static/chunks/460-c19bf6dfa8d62bcf.js\",\"473\",\"static/chunks/473-def3eddc7671c707.js\",\"177\",\"static/chunks/app/layout-23eab13111997091.js\"],\"default\"]\n14:I[494,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\""])</script>
142<script>self.__next_f.push([1,"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"583\",\"static/chunks/583-5f6d92491e21849f.js\",\"460\",\"static/chunks/460-c19bf6dfa8d62bcf.js\",\"473\",\"static/chunks/473-def3eddc7671c707.js\",\"177\",\"static/chunks/app/layout-23eab13111997091.js\"],\"default\"]\n15:I[4024,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"583\",\"static/chunks/583-5f6d92491e21849f.js\",\"460\",\"static/chunks/460-c19bf6dfa8d62bcf.js\",\"473\",\"static/chunks/473-def3eddc7671c707.js\",\"177\",\"static/chunks/app/layout-23eab13111997091.js\"],\"ModeToggle\"]\n16:I[5244,[],\"\"]\n17:I[8725,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"39\",\"static/chunks/app/error-a1b6678d49d2b46b.js\"],\"default\"]\n18:I[3866,[],\"\"]\n19:I[6481,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"583\",\"static/chunks/583-5f6d92491e21849f.js\",\"460\",\"static/chunks/460-c19bf6dfa8d62bcf.js\",\"473\",\"static/chunks/473-def3eddc7671c707.js\",\"177\",\"static/chunks/app/layout-23eab13111997091.js\"],\"default\"]\n1a:I[9093,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"583\",\"static/chunks/583-5f6d92491e21849f.js\",\"460\",\"static/chunks/460-c19bf6dfa8d62bcf.js\",\"473\",\"static/chunks/473-def3eddc7671c707.js\",\"177\",\"static/chunks/app/layout-23eab13111997091.js\"],\"default\"]\n1b:I[4547,[],\"ClientSegmentRoot\"]\n1c:I[8580,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js"])</script>
142<script>self.__next_f.push([1,"\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"583\",\"static/chunks/583-5f6d92491e21849f.js\",\"473\",\"static/chunks/473-def3eddc7671c707.js\",\"499\",\"static/chunks/app/docs/layout-73220267cf61be31.js\"],\"default\"]\n1f:I[6213,[],\"OutletBoundary\"]\n21:I[6213,[],\"MetadataBoundary\"]\n23:I[6213,[],\"ViewportBoundary\"]\n25:I[4835,[],\"\"]\n1:HL[\"/learn/_next/static/media/3f5170f2649be2e5-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n2:HL[\"/learn/_next/static/media/fc727f226c737876-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n3:HL[\"/learn/_next/static/css/0790576569b8c287.css\",\"style\"]\n4:HL[\"/learn/_next/static/css/781449e376c693a2.css\",\"style\"]\n"])</script>
142<script>self.__next_f.push([1,"0:{\"P\":null,\"b\":\"g9afxyrAF41b8RSNsIEQn\",\"p\":\"/learn\",\"c\":[\"\",\"docs\",\"sdk\",\"installation\"],\"i\":false,\"f\":[[[\"\",{\"children\":[\"docs\",{\"children\":[[\"slug\",\"sdk/installation\",\"oc\"],{\"children\":[\"__PAGE__\",{}]}]}]},\"$undefined\",\"$undefined\",true],[\"\",[\"$\",\"$5\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/learn/_next/static/css/0790576569b8c287.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/learn/_next/static/css/781449e376c693a2.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"suppressHydrationWarning\":true,\"children\":[[\"$\",\"head\",null,{\"children\":[[\"$\",\"link\",null,{\"rel\":\"stylesheet\",\"type\":\"text/css\",\"href\":\"https://cdn.jsdelivr.net/gh/devicons/devicon@latest/devicon.min.css\"}],[\"$\",\"script\",null,{\"type\":\"application/ld+json\",\"dangerouslySetInnerHTML\":{\"__html\":\"{\\\"@context\\\":\\\"https://schema.org\\\",\\\"@type\\\":\\\"SoftwareApplication\\\",\\\"name\\\":\\\"React Native Stallion\\\",\\\"applicationCategory\\\":\\\"DeveloperApplication\\\",\\\"operatingSystem\\\":\\\"React Native\\\",\\\"offers\\\":{\\\"@type\\\":\\\"Offer\\\",\\\"price\\\":\\\"0\\\",\\\"priceCurrency\\\":\\\"USD\\\"},\\\"description\\\":\\\"React Native Stallion is a modern OTA update platform for React Native apps. Get patch updates, advanced controls, and seamless integration. Perfect CodePush alternative.\\\",\\\"url\\\":\\\"https://stalliontech.io/learn/\\\",\\\"author\\\":{\\\"@type\\\":\\\"Organization\\\",\\\"name\\\":\\\"Stallion Tech\\\",\\\"url\\\":\\\"https://stalliontech.io\\\"},\\\"aggregateRating\\\":{\\\"@type\\\":\\\"AggregateRating\\\",\\\"ratingValue\\\":\\\"4.8\\\",\\\"ratingCount\\\":\\\"100\\\"}}\"}}]]}],[\"$\",\"body\",null,{\"className\":\"__variable_0e2adc __variable_7f3a7b font-regular antialiased tracking-wide\",\"suppressHydrationWarning\":true,\"children\":[\"$\",\"$L6\",null,{\"attribute\":\"class\",\"defaultTheme\":\"system\",\"enableSystem\":true,\"disableTransitionOnChange\":true,\"children\":[\"$\",\"$L7\",null,{\"children\":[[\"$\",\"$L8\",null,{}],[\"$\",\"$L9\",null,{\"children\":[[\"$\",\"nav\",null,{\"className\":\"w-full border-b border-border/60 h-16 sticky top-0 z-50 bg-background/80 backdrop-blur-md supp
142orts-[backdrop-filter]:bg-background/60\",\"children\":[\"$\",\"div\",null,{\"className\":\"sm:container mx-auto w-[95vw] h-full flex items-center sm:justify-between md:gap-2\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center sm:gap-5 gap-2.5\",\"children\":[[\"$\",\"$La\",null,{\"children\":[[\"$\",\"$Lb\",null,{\"asChild\":true,\"children\":[\"$\",\"button\",null,{\"className\":\"items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-9 w-9 md:hidden flex\",\"ref\":\"$undefined\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-align-left\",\"children\":[[\"$\",\"line\",\"1fp77t\",{\"x1\":\"21\",\"x2\":\"3\",\"y1\":\"6\",\"y2\":\"6\"}],[\"$\",\"line\",\"v6grx8\",{\"x1\":\"15\",\"x2\":\"3\",\"y1\":\"12\",\"y2\":\"12\"}],[\"$\",\"line\",\"1awlsn\",{\"x1\":\"17\",\"x2\":\"3\",\"y1\":\"18\",\"y2\":\"18\"}],\"$undefined\"]}]}]}],[\"$\",\"$Lc\",null,{\"className\":\"flex flex-col gap-4 px-0\",\"side\":\"left\",\"children\":[[\"$\",\"$Ld\",null,{\"className\":\"sr-only\",\"children\":\"Menu\"}],[\"$\",\"$Le\",null,{\"children\":[\"$\",\"$Lf\",null,{\"className\":\"px-5\",\"asChild\":true,\"children\":[\"$\",\"$L10\",null,{\"href\":\"/\",\"className\":\"flex items-center gap-2.5\",\"children\":[\"$\",\"$L11\",null,{\"src\":{\"src\":\"/learn/_next/static/media/stallion-docs-logo.73aa2b2e.svg\",\"height\":154,\"width\":447,\"blurWidth\":0,\"blurHeight\":0},\"alt\":\"$0:f:0:1:1:props:children:1:props:children:1:props:children:props:children:props:children:1:props:children:0:props:children:props:children:0:props:children:0:props:children:1:props:children:1:props:children:props:children:props:children:props:src\",\"width\":92,\"height\":61}]}]}]}],[\"$\",\"div\",null,{\"className\":\"flex flex-col gap-4 overflow-y-auto\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex flex-col gap-2.5 mt-3 mx-2 px-5\",\"children\":[[\"$\",\"$Lf\",\"Documentation/docs/introduction\",{\"asChild\":true,\"children\":[\"$\",\"$L12\",\"Documentation/docs/introduction\",{\"activeClassName\":\"!text-primary dark:font-medium font-semibold\",\"absolute\":true,\"className\":\"flex items-center gap-1 sm:text-base text-[14.5px] dark:text-stone-300/85 text-stone-800\",\"href\":\"/docs/introduction\",\"children\":\"Documentation\"}]}],[\"$\",\"$Lf\",\"Blog/blogs\",{\"asChild\":true,\"children\":[\"$\",\"$L12\",\"Blog/blogs\",{\"activeClassName\":\"!text-primary dark:font-medium font-semibold\",\"absolute\":true,\"className\":\"flex items-center gap-1 sm:text-base text-[14.5px] dark:text-stone-300/85 text-stone-800\",\"href\":\"/blogs\",\"children\":\"Blog\"}]}],[\"$\",\"$Lf\",\"Communityhttps://discord.gg/HzqsrKF5wv\",{\"asChild\":true,\"children\":[\"$\",\"$L12\",\"Communityhttps://discord.gg/HzqsrKF5wv\",{\"activeClassName\":\"!text-primary dark:font-medium font-semibold\",\"absolute\":true,\"className\":\"flex items-center gap-1 sm:text-base text-[14.5px] dark:text-stone-300/85 text-stone-800\",\"href\":\"https://discord.gg/HzqsrKF5wv\",\"children\":\"Community\"}]}]]}],[\"$\",\"div\",null,{\"className\":\"ml-2 pl-5\",\"children\":[\"$\",\"$L13\",null,{\"isSheet\":true}]}],[\"$\",\"div\",null,{\"className\":\"p-6 pb-4 flex gap-2.5\",\"children\":[[\"$\",\"$L10\",null,{\"href\":\"https://github.com/stallion-tech/react-native-stallion\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-foreground hover:bg-primary/90 h-9 rounded-md px-3\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\"
142:24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-github h-4 w-4\",\"children\":[[\"$\",\"path\",\"tonef\",{\"d\":\"M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4\"}],[\"$\",\"path\",\"9comsn\",{\"d\":\"M9 18c-4.51 2-5-2-7-2\"}],\"$undefined\"]}],\"⭐ Star on GitHub\"]}],[\"$\",\"$L10\",null,{\"href\":\"https://www.linkedin.com/company/stalliontechnologies\",\"className\":\"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border border-input bg-background hover:bg-accent hover:text-accent-foreground h-9 rounded-md px-3\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-linkedin h-4 w-4 mr-2 fill-current\",\"children\":[[\"$\",\"path\",\"c2jq9f\",{\"d\":\"M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z\"}],[\"$\",\"rect\",\"mk3on5\",{\"width\":\"4\",\"height\":\"12\",\"x\":\"2\",\"y\":\"9\"}],[\"$\",\"circle\",\"bt5ra8\",{\"cx\":\"4\",\"cy\":\"4\",\"r\":\"2\"}],\"$undefined\"]}],\"Linkedin\"]}]]}]]}]]}]]}],[\"$\",\"div\",null,{\"className\":\"flex items-center gap-6\",\"children\":[[\"$\",\"div\",null,{\"className\":\"sm:flex hidden\",\"children\":[\"$\",\"$L10\",null,{\"href\":\"/\",\"className\":\"flex items-center gap-2.5\",\"children\":[\"$\",\"$L11\",null,{\"src\":\"$0:f:0:1:1:props:children:1:props:children:1:props:children:props:children:props:children:1:props:children:0:props:children:props:children:0:props:children:0:props:children:1:props:children:1:props:children:props:children:props:children:props:src\",\"alt\":\"$0:f:0:1:1:props:children:1:props:children:1:props:children:props:children:props:children:1:props:children:0:props:children:props:children:0:props:children:0:props:children:1:props:children:1:props:children:props:children:props:children:props:src\",\"width\":92,\"height\":61}]}]}],[\"$\",\"div\",null,{\"className\":\"md:flex hidden items-center gap-4 text-sm font-medium text-muted-foreground\",\"children\":[[\"$\",\"$L12\",\"Documentation/docs/introduction\",{\"activeClassName\":\"!text-primary dark:font-medium font-semibold\",\"absolute\":true,\"className\":\"flex items-center gap-1 sm:text-base text-[14.5px] dark:text-stone-300/85 text-stone-800\",\"href\":\"/docs/introduction\",\"children\":\"Documentation\"}],[\"$\",\"$L12\",\"Blog/blogs\",{\"activeClassName\":\"!text-primary dark:font-medium font-semibold\",\"absolute\":true,\"className\":\"flex items-center gap-1 sm:text-base text-[14.5px] dark:text-stone-300/85 text-stone-800\",\"href\":\"/blogs\",\"children\":\"Blog\"}],[\"$\",\"$L12\",\"Communityhttps://discord.gg/HzqsrKF5wv\",{\"activeClassName\":\"!text-primary dark:font-medium font-semibold\",\"absolute\":true,\"className\":\"flex items-center gap-1 sm:text-base text-[14.5px] dark:text-stone-300/85 text-stone-800\",\"href\":\"https://discord.gg/HzqsrKF5wv\",\"children\":\"Community\"}]]}]]}]]}],[\"$\",\"div\",null,{\"className\":\"flex items-center sm:justify-normal justify-between sm:gap-3 ml-1 sm:w-fit w-[90%]\",\"children\":[[\"$\",\"$L14\",null,{\"appId\":\"MQB73XETVX\",\"indexName\":\"learn-stalliontech\",\"apiKey\":\"a3b317997b738a2b1d46147b2ebaf805\"}],[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between sm:gap-2\",\"children\":[\"$\",\"div\",null,{\"className\":\"flex ml-4 sm:ml-0\",\"children\":[[\"$\",\"$L10\",null,{\"href\":\"https://github.com/stallion-tech/react-native-stallion\",\"className\":\"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-9 w-9\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\"
142:24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-github h-[1.1rem] w-[1.1rem]\",\"children\":[[\"$\",\"path\",\"tonef\",{\"d\":\"M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4\"}],[\"$\",\"path\",\"9comsn\",{\"d\":\"M9 18c-4.51 2-5-2-7-2\"}],\"$undefined\"]}]}],[\"$\",\"$L10\",null,{\"href\":\"https://www.linkedin.com/company/stalliontechnologies\",\"className\":\"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 hover:bg-accent hover:text-accent-foreground h-9 w-9\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-linkedin h-[1.1rem] w-[1.1rem]\",\"children\":[[\"$\",\"path\",\"c2jq9f\",{\"d\":\"M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z\"}],[\"$\",\"rect\",\"mk3on5\",{\"width\":\"4\",\"height\":\"12\",\"x\":\"2\",\"y\":\"9\"}],[\"$\",\"circle\",\"bt5ra8\",{\"cx\":\"4\",\"cy\":\"4\",\"r\":\"2\"}],\"$undefined\"]}]}],[\"$\",\"$L15\",null,{}]]}]}]]}]]}]}],[\"$\",\"main\",null,{\"className\":\"sm:container mx-auto w-[90vw] h-auto scroll-smooth\",\"children\":[\"$\",\"$L16\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\"],\"error\":\"$17\",\"errorStyles\":[],\"errorScripts\":[],\"template\":[\"$\",\"$L18\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[\"$\",\"div\",null,{\"className\":\"min-h-[87vh] px-2 sm:py-28 py-36 flex flex-col gap-4 items-center\",\"children\":[[\"$\",\"div\",null,{\"className\":\"text-center flex flex-col items-center justify-center w-fit gap-2\",\"children\":[[\"$\",\"h2\",null,{\"className\":\"text-7xl font-bold pr-1\",\"children\":\"404\"}],[\"$\",\"p\",null,{\"className\":\"text-muted-foreground text-md font-medium\",\"children\":[\"Page not found \",\":(\"]}],[\"$\",\"p\",null,{\"children\":\"Oops! The page you're looking for doesn't exist.\"}]]}],[\"$\",\"$L10\",null,{\"href\":\"/\",\"className\":\"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-foreground hover:bg-primary/90 h-10 px-4 py-2\",\"children\":\"Back to homepage\"}]]}],\"notFoundStyles\":[]}]}],[\"$\",\"footer\",null,{\"className\":\"border-t w-full h-16\",\"children\":[\"$\",\"div\",null,{\"className\":\"container flex items-center sm:justify-between justify-center sm:gap-0 gap-4 h-full text-muted-foreground text-sm flex-wrap sm:py-0 py-3 max-sm:px-4\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center gap-3\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-center\",\"children\":\"Copyright © 2026 Redhorse Technologies\"}]}],[\"$\",\"div\",null,{\"className\":\"gap-4 items-center hidden md:flex\",\"children\":[[\"$\",\"$L10\",null,{\"href\":\"https://github.com/stallion-tech/react-native-stallion\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"className\":\"inline-flex items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-foreground hover:bg-primary/90 h-9 rounded-md px-3\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\"
142:24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-github h-4 w-4\",\"children\":[[\"$\",\"path\",\"tonef\",{\"d\":\"M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4\"}],[\"$\",\"path\",\"9comsn\",{\"d\":\"M9 18c-4.51 2-5-2-7-2\"}],\"$undefined\"]}],\"⭐ Star on GitHub\"]}],[\"$\",\"$L10\",null,{\"href\":\"https://www.linkedin.com/company/stalliontechnologies\",\"className\":\"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border border-input bg-background hover:bg-accent hover:text-accent-foreground h-9 rounded-md px-3\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-linkedin h-4 w-4 mr-2 fill-current\",\"children\":[[\"$\",\"path\",\"c2jq9f\",{\"d\":\"M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z\"}],[\"$\",\"rect\",\"mk3on5\",{\"width\":\"4\",\"height\":\"12\",\"x\":\"2\",\"y\":\"9\"}],[\"$\",\"circle\",\"bt5ra8\",{\"cx\":\"4\",\"cy\":\"4\",\"r\":\"2\"}],\"$undefined\"]}],\"Linkedin\"]}]]}]]}]}]]}],[\"$\",\"$L19\",null,{}],[\"$\",\"$L1a\",null,{}]]}]}]}]]}]]}],{\"children\":[\"docs\",[\"$\",\"$5\",\"c\",{\"children\":[null,[\"$\",\"$L1b\",null,{\"Component\":\"$1c\",\"slots\":{\"children\":[\"$\",\"$L16\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\",\"docs\",\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L18\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"notFoundStyles\":\"$undefined\"}]},\"params\":{},\"promise\":\"$@1d\"}]]}],{\"children\":[[\"slug\",\"sdk/installation\",\"oc\"],[\"$\",\"$5\",\"c\",{\"children\":[null,[\"$\",\"$L16\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\",\"docs\",\"children\",\"$0:f:0:1:2:children:2:children:0\",\"children\"],\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L18\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"notFoundStyles\":\"$undefined\"}]]}],{\"children\":[\"__PAGE__\",[\"$\",\"$5\",\"c\",{\"children\":[\"$L1e\",null,[\"$\",\"$L1f\",null,{\"children\":\"$L20\"}]]}],{},null]},null]},null]},null],[\"$\",\"$5\",\"h\",{\"children\":[null,[\"$\",\"$5\",\"_VFpX3njRcQ3LHlJbgBfu\",{\"children\":[[\"$\",\"$L21\",null,{\"children\":\"$L22\"}],[\"$\",\"$L23\",null,{\"children\":\"$L24\"}],[\"$\",\"meta\",null,{\"name\":\"next-size-adjust\"}]]}]]}]]],\"m\":\"$undefined\",\"G\":[\"$25\",\"$undefined\"],\"s\":false,\"S\":true}\n"])</script>
142<script>self.__next_f.push([1,"1d:{}\n"])</script>
142<script>self.__next_f.push([1,"24:[[\"$\",\"meta\",\"0\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}]]\n"])</script>
142<script>self.__next_f.push([1,"22:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"title\",\"1\",{\"children\":\"Installation | React Native Stallion\"}],[\"$\",\"meta\",\"2\",{\"name\":\"description\",\"content\":\"React Native Stallion installation guide - Get started with OTA updates in 5 easy steps. Install SDK and CLI for React Native apps. Complete setup instructions.\"}],[\"$\",\"link\",\"3\",{\"rel\":\"canonical\",\"href\":\"https://stalliontech.io/learn/docs/sdk/installation\"}],[\"$\",\"meta\",\"4\",{\"property\":\"og:title\",\"content\":\"Installation | React Native Stallion\"}],[\"$\",\"meta\",\"5\",{\"property\":\"og:description\",\"content\":\"React Native Stallion installation guide - Get started with OTA updates in 5 easy steps. Install SDK and CLI for React Native apps. Complete setup instructions.\"}],[\"$\",\"meta\",\"6\",{\"property\":\"og:url\",\"content\":\"https://stalliontech.io/learn/docs/sdk/installation\"}],[\"$\",\"meta\",\"7\",{\"property\":\"og:site_name\",\"content\":\"React Native Stallion\"}],[\"$\",\"meta\",\"8\",{\"property\":\"og:type\",\"content\":\"article\"}],[\"$\",\"meta\",\"9\",{\"name\":\"twitter:card\",\"content\":\"summary_large_image\"}],[\"$\",\"meta\",\"10\",{\"name\":\"twitter:title\",\"content\":\"React Native Stallion Documentation\"}],[\"$\",\"meta\",\"11\",{\"name\":\"twitter:description\",\"content\":\"The best CodePush alternative for React Native OTA updates.\"}],[\"$\",\"link\",\"12\",{\"rel\":\"icon\",\"href\":\"https://assets.stalliontech.io/favicon.ico\"}]]\n20:null\n"])</script>
142<script>self.__next_f.push([1,"26:I[4224,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"140\",\"static/chunks/140-38b38c63288b6c5d.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-4f333ec4fedcfb8c.js\"],\"default\"]\n28:I[1861,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"140\",\"static/chunks/140-38b38c63288b6c5d.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-4f333ec4fedcfb8c.js\"],\"default\"]\n27:T1b7a,"])</script>
142<script>self.__next_f.push([1,"# Installation\nReact Native Stallion installation guide - Get started with OTA updates in 5 easy steps. Install SDK and CLI for React Native apps. Complete setup instructions.\n\nSetting up React Native Stallion is straight forward, just install the CLI and SDK and start using. React Native Stallion requires [react-native](https://reactnative.dev/versions/) version 0.69 or higher for optimal performance.\n\n\u003ciframe\n  width=\"100%\"\n  height=\"400\"\n  src=\"https://www.youtube.com/embed/BZAKdfpn1Ug\"\n  title=\"Stallion Introduction\"\n  frameBorder=\"0\"\n  style={{ borderRadius: \"8px\" }}\n  allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\"\n  allowFullScreen\n/\u003e\n\n### SDK Installation\n\nTo get started, install the SDK using npm or yarn.\n\n  \n### Step 1: Install the React Native Stallion SDK and CLI\n\n    Begin by installing SDK in your react-native project:\n\n    ```bash\n    npm i react-native-stallion\n    ```\n    or if you are using yarn then\n    ```bash\n    yarn add react-native-stallion\n    ```\n    for steps to install the CLI checkout [CLI Installation Docs](/docs/cli/installation#installation)\n\n  \n\n  \n### Step 2: Native Installation\n\n    After installing the SDK, you need to install pods for iOS and gradle sync android project:\n\n    ```plaintext\n    npx pod-install\n    ```\n\n  \n\n  \n### Step 3: Add Stallion bundle support in Android and iOS projects\n\n      - **Android** - Inside `MainApplication.java`, override and implement `getJSBundleFile` method :\n\n        ```java:MainApplication.java\n        // ...other imports\n        import com.stallion.Stallion;\n\n        public class MainApplication extends Application implements ReactApplication {\n          // ...rest of the class\n          @Override\n          protected String getJS
142BundleFile() {\n              return Stallion.getJSBundleFile(getApplicationContext());\n          }\n        }\n        ```\n        **If running on latest version of react-native (\u003ev0.76)** \\\n        Inside `MainApplication.kt` file edit the `reactNativeHost` method:\n        ```kotlin:MainApplication.kt\n        // ...other imports\n        import com.stallion.Stallion\n\n        // ...other functions\n        override val reactNativeHost: ReactNativeHost =\n          object : DefaultReactNativeHost(this) {\n            override fun getPackages(): List =\n              //other methods...\n\n              override fun getJSBundleFile(): String? {\n                  return Stallion.getJSBundleFile(applicationContext)\n              }\n          }\n        ```\n\n        **If running on React Native 82 and above** \\\n        Inside `MainApplication.kt` file, override the `reactHost` property:\n        ```kotlin:MainApplication.kt\n        // ...other imports\n        import com.facebook.react.ReactHost\n        import com.facebook.react.defaults.DefaultReactHost.getDefaultReactHost\n        import com.stallion.Stallion\n\n        class MainApplication : Application(), ReactApplication {\n          override val reactHost: ReactHost by lazy {\n            getDefaultReactHost(\n              context = applicationContext,\n              packageList = PackageList(this).packages,\n              jsBundleFilePath = Stallion.getJSBundleFile(applicationContext)\n            )\n          }\n        }\n        ```\n\n      - **iOS** - Inside `ios/AppDelegate.mm` file edit `bundleURL` method\n\n        ```objectivec\n        // ...other imports\n        #import \"StallionModule.h\"\n\n        @implementation AppDelegate\n        // ...other implemetations\n        - (NSURL *)bundleURL\n          {\n            #if DEBUG\n              return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@\"index\"];\n            #else\n              return [StallionModule getBundleURL];\n            #endif\n          }\n        ```\n\n        **If running on latest version of react-native (\u003ev0.76)** \\\n        Inside `ios/AppDelegate.swift` file edit the `bundleURL` method:\n        ```swift\n        // ...other imports\n        import react_native_stallion\n\n        // ...other functions\n        override func bundleURL() -\u003e URL? {\n            #if DEBUG\n                RCTBundleURLProvider.sharedSettings().jsBundleURL(forBundleRoot: \"index\")\n            #else\n                StallionModule.getBundleURL()\n            #endif\n        }\n        ```\n\n  \n\n  \n### Step 4: Add ProjectId \u0026 AppToken in native\n\n      - **Get projectID from Stallion Dashboard :**\n      On project info page, copy project id.\n      ![Alt text for the image](https://assets.stalliontech.io/project_id.png)\n\n      - **Generate App Token :**\n      Navigate to `Project \u003e Project Settings \u003e Access Tokens`, and select `Generate` or `Regenerate App` Token to create a new token.\n      ![Alt text for the image](https://assets.stalliontech.io/gen_app_token.png)\n\n      Add `StallionProjectId` \u0026 `StallionAppToken` as shown below -\n        - **iOS**: Add the copied App Token and projectId to `info.plist`\n          ```xml\n          \u003cplist version=\"1.0\"\u003e\n            \u003cdict\u003e\n              \u003c!-- ...other configs... --\u003e\n              \u003ckey\u003eStallionProjectId\u003c/key\u003e\n              \u003cstring\u003e66ed03380eb95c9c316256d3\u003c/string\u003e\n              \u003c!-- make sure app token starts with spb_... and is 46 characters long --\u003e\n              \u003ckey\u003eStallionAppToken\u003c/key\u003e\n              \u003cstring\u003espb_FTLx5umZgKLTEyiMNf9-81BgANTOvx7pNhA-gFXbg9\u003c/string\u003e\n              \u003c!-- ...other configs... --\u003e\n            \u003c/dict\u003e\n          \u003c/plist\u003e\n          ```\n          ![Alt text for the image](https://assets.stalliontech.io/ios_info_plist.png)\n\n        - **android**: Add the copied App Token and projectId to `strings.xml`\n          ```xml\n          \u003cresources\u003e\n            \u003cstring name=\"app_name\"\u003emy_app\u003c/string\u003e\n            \u003c!-- make sure app token starts with spb_... and is 46 characters long --\u003e\n            \u003cstring name=\"StallionProjectId\"\u003e66ed03380eb95c9c316256d3\u003c/string\u003e\n            \u003cstring name=\"StallionAppToken\"\u003espb_FTLx5umZgKLTEyiMNf9-81BgANTOvx7pNhA-gFXbg9\u003c/string\u003e\n          \u003c/resources\u003e\n          ```\n          ![Alt text for the image](https://assets.stalliontech.io/android_strings_xml.png)\n\n  \n\n    \n### Step 5: Import and add Stallion as HOC in App.js\n\n       - Import `withStallion` HOC\n         ```javascript\n         import { withStallion } from 'react-native-stallion';\n         ```\n       - Wrap root component (generally App.tsx or App.js) with HOC\n         ```javascript\n         export default withStallion(App)\n         ```\n    \n\n  \n\nWith this setup, you’ll have installed Stallion. I next section we will see how to use Stallion to deploy bundles and get realtime updates.\
142n\n**Remember**\n\n  After installing Stallion in your React Native app, make sure to publish a\n  build (APK or TestFlight) with Stallion fully integrated. This is essential to\n  test and verify that OTA updates are being correctly installed via Stallion.\n  Note: If you're running your app in development mode connected to the Metro\n  bundler, Stallion's OTA changes will not be applied. To properly test OTA\n  updates, you must use a published app build.\n"])</script>
142<script>self.__next_f.push([1,"1e:[[\"$\",\"script\",null,{\"type\":\"application/ld+json\",\"dangerouslySetInnerHTML\":{\"__html\":\"{\\\"@context\\\":\\\"https://schema.org\\\",\\\"@type\\\":\\\"BreadcrumbList\\\",\\\"itemListElement\\\":[{\\\"@type\\\":\\\"ListItem\\\",\\\"position\\\":1,\\\"name\\\":\\\"Docs\\\",\\\"item\\\":\\\"https://stalliontech.io/learn/docs/introduction\\\"},{\\\"@type\\\":\\\"ListItem\\\",\\\"position\\\":2,\\\"name\\\":\\\"Sdk\\\",\\\"item\\\":\\\"https://stalliontech.io/learn/docs/sdk\\\"},{\\\"@type\\\":\\\"ListItem\\\",\\\"position\\\":3,\\\"name\\\":\\\"Installation\\\",\\\"item\\\":\\\"https://stalliontech.io/learn/docs/sdk/installation\\\"}]}\"}}],[\"$\",\"script\",null,{\"type\":\"application/ld+json\",\"dangerouslySetInnerHTML\":{\"__html\":\"{\\\"@context\\\":\\\"https://schema.org\\\",\\\"@type\\\":\\\"HowTo\\\",\\\"name\\\":\\\"Installation\\\",\\\"description\\\":\\\"React Native Stallion installation guide - Get started with OTA updates in 5 easy steps. Install SDK and CLI for React Native apps. Complete setup instructions.\\\",\\\"step\\\":[{\\\"@type\\\":\\\"HowToStep\\\",\\\"position\\\":1,\\\"name\\\":\\\"Step 1: Install the React Native Stallion SDK and CLI\\\",\\\"text\\\":\\\"Step 1: Install the React Native Stallion SDK and CLI\\\"},{\\\"@type\\\":\\\"HowToStep\\\",\\\"position\\\":2,\\\"name\\\":\\\"Step 2: Native Installation\\\",\\\"text\\\":\\\"Step 2: Native Installation\\\"},{\\\"@type\\\":\\\"HowToStep\\\",\\\"position\\\":3,\\\"name\\\":\\\"Step 3: Add Stallion bundle support in Android and iOS projects\\\",\\\"text\\\":\\\"Step 3: Add Stallion bundle support in Android and iOS projects\\\"},{\\\"@type\\\":\\\"HowToStep\\\",\\\"position\\\":4,\\\"name\\\":\\\"Step 4: Add ProjectId \u0026 AppToken in native\\\",\\\"text\\\":\\\"Step 4: Add ProjectId \u0026 AppToken in native\\\"},{\\\"@type\\\":\\\"HowToStep\\\",\\\"position\\\":5,\\\"name\\\":\\\"Step 5: Import and add Stallion as HOC in App.js\\\",\\\"text\\\":\\\"Step 5: Import and add Stallion as HOC in App.js\\\"}]}\"}}],[\"$\",\"div\",null,{\"className\":\"flex items-start gap-10\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex-[4.5] py-10\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex items-center justify-between gap-4\",\"children\":[[\"$\",\"div\",null,{\"className\":\"pb-5\",\"children\":[\"$\",\"nav\",null,{\"ref\":\"$undefined\",\"aria-label\":\"breadcrumb\",\"children\":[\"$\",\"ol\",null,{\"ref\":\"$undefined\",\"className\":\"flex flex-wrap items-center gap-1.5 break-words text-sm text-muted-foreground sm:gap-2.5\",\"children\":[[\"$\",\"li\",null,{\"ref\":\"$undefined\",\"className\":\"inline-flex items-center gap-1.5\",\"children\":[\"$\",\"$L10\",null,{\"href\":\"/docs/introduction\",\"children\":\"Docs\",\"ref\":null,\"className\":\"transition-colors hover:text-foreground\"}]}],[[\"$\",\"$5\",\"sdk\",{\"children\":[[\"$\",\"li\",null,{\"role\":\"presentation\",\"aria-hidden\":\"true\",\"className\":\"[\u0026\u003esvg]:size-3.5\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-chevron-right\",\"children\":[[\"$\",\"path\",\"mthhwq\",{\"d\":\"m9 18 6-6-6-6\"}],\"$undefined\"]}]}],[\"$\",\"li\",null,{\"ref\":\"$undefined\",\"className\":\"inline-flex items-center gap-1.5\",\"children\":[\"$\",\"$L10\",null,{\"href\":\"/docs/sdk\",\"children\":\"Sdk\",\"ref\":null,\"className\":\"transition-colors hover:text-foreground\"}]}]]}],[\"$\",\"$5\",\"installation\",{\"children\":[[\"$\",\"li\",null,{\"role\":\"presentation\",\"aria-hidden\":\"true\",\"className\":\"[\u0026\u003esvg]:size-3.5\",\"children\":[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-chevron-right\",\"children\":[[\"$\",\"path\",\"mthhwq\",{\"d\":\"m9 18 6-6-6-6\"}],\"$undefined\"]}]}],[\"$\",\"li\",null,{\"ref\":\"$undefined\",\"className\":\"inline-flex items-center gap-1.5\",\"children\":[\"$\",\"span\",null,{\"ref\":\"$undefined\",\"role\":\"link\",\"aria-disabled\":\"true\",\"aria-current\":\"page\",\"className\":\"font-normal text-foreground\",\"children\":\"Installation\"}]}]]}]]]}]}]}],[\"$\",\"$L26\",null,{\"markdown\":\"$27\",\"mdUrl\":\"https://stalliontech.io/learn/docs/sdk/installation.md\"}]]}],[\"$\",\"div\",null,{\"className\":\"prose sm:prose-base prose-sm prose-zinc dar
142k:prose-invert prose-code:font-normal prose-code:font-code dark:prose-code:bg-stone-900/25 prose-code:bg-stone-50 prose-pre:bg-background prose-headings:scroll-m-20 w-[85vw] sm:w-full sm:mx-auto prose-code:text-sm prose-code:leading-6 dark:prose-code:text-white prose-code:text-stone-800 prose-code:p-[0.085rem]  prose-code:rounded-md prose-code:border pt-2 !min-w-full prose-img:rounded-md prose-img:border prose-code:before:content-none prose-code:after:content-none prose-code:px-1.5 prose-code:overflow-x-auto !max-w-[500px] prose-img:my-3 prose-h2:my-4 prose-h2:mt-8 prose-code:break-all\",\"children\":[[\"$\",\"h1\",null,{\"className\":\"sm:text-3xl text-2xl !-mt-0.5\",\"children\":\"Installation\"}],[\"$\",\"p\",null,{\"className\":\"-mt-4 text-muted-foreground sm:text-[16.5px] text-[14.5px]\",\"children\":\"React Native Stallion installation guide - Get started with OTA updates in 5 easy steps. Install SDK and CLI for React Native apps. Complete setup instructions.\"}],[\"$\",\"div\",null,{\"children\":[[\"$\",\"p\",null,{\"children\":[\"Setting up React Native Stallion is straight forward, just install the CLI and SDK and start using. React Native Stallion requires \",[\"$\",\"$L10\",null,{\"href\":\"https://reactnative.dev/versions/\",\"children\":\"react-native\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\"}],\" version 0.69 or higher for optimal performance.\"]}],\"\\n\",[\"$\",\"iframe\",null,{\"width\":\"100%\",\"height\":\"400\",\"src\":\"https://www.youtube.com/embed/BZAKdfpn1Ug\",\"title\":\"Stallion Introduction\",\"frameBorder\":\"0\",\"style\":{\"borderRadius\":\"8px\"},\"allow\":\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\",\"allowFullScreen\":true}],\"\\n\",[\"$\",\"h3\",null,{\"id\":\"sdk-installation\",\"children\":[[\"$\",\"$L10\",null,{\"href\":\"#sdk-installation\",\"aria-hidden\":\"true\",\"tabIndex\":\"-1\",\"children\":[\"$\",\"span\",null,{\"className\":\"icon icon-link\"}],\"target\":\"_blank\",\"rel\":\"noopener noreferrer\"}],\"SDK Installation\"]}],\"\\n\",[\"$\",\"p\",null,{\"children\":\"To get started, install the SDK using npm or yarn.\"}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"flex flex-col\",\"children\":[[\"$\",\"div\",\".0\",{\"className\":\"border-l pl-9 ml-3 relative pb-5\",\"children\":[[\"$\",\"div\",null,{\"className\":\"bg-muted w-8 h-8 text-xs font-medium rounded-md border flex items-center justify-center absolute -left-4 font-code\",\"children\":1}],[\"$\",\"div\",null,{\"className\":\"pt-0.5\",\"children\":[[\"$\",\"h4\",null,{\"className\":\"mt-0\",\"children\":\"Step 1: Install the React Native Stallion SDK and CLI\"}],[\"$\",\"div\",null,{\"children\":[[\"$\",\"p\",null,{\"children\":\"Begin by installing SDK in your react-native project:\"}],[\"$\",\"div\",null,{\"className\":\"my-5 relative\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute top-3 right-2.5 z-10 sm:block hidden\",\"children\":[\"$\",\"$L28\",null,{\"content\":\"npm i react-native-stallion\\n\"}]}],[\"$\",\"div\",null,{\"className\":\"relative\",\"children\":[\"$\",\"pre\",null,{\"className\":\"language-bash\",\"children\":[\"$\",\"code\",null,{\"className\":\"language-bash code-highlight\",\"children\":[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"npm\"}],\" i react-native-stallion\\n\"]}]}]}]}]]}],[\"$\",\"p\",null,{\"children\":\"or if you are using yarn then\"}],[\"$\",\"div\",null,{\"className\":\"my-5 relative\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute top-3 right-2.5 z-10 sm:block hidden\",\"children\":[\"$\",\"$L28\",null,{\"content\":\"yarn add react-native-stallion\\n\"}]}],[\"$\",\"div\",null,{\"className\":\"relative\",\"children\":[\"$\",\"pre\",null,{\"className\":\"language-bash\",\"children\":[\"$\",\"code\",null,{\"className\":\"language-bash code-highlight\",\"children\":[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"yarn\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"add\"}],\" react-native-stallion\\n\"]}]}]}]}]]}],[\"$\",\"p\",null,{\"children\":[\"for steps to install the CLI checkout \",[\"$\",\"$L10\",null,{\"href\":\"/docs/cli/installation#installation\",\"children\":\"CLI Installation Docs\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\"}]]}]]}]]}]]}],[\"$\",\"div\",\".1\",{\"className\":\"border-l pl-9 ml-3 relative pb-5\",\"children\":[[\"$\",\"div\",null,{\"className\":\"bg-muted w-8 h-8 text-xs font-medium rounded-md border flex items-center justify-center absolute -left-4 font-code\",\"children\":2}],[\"$\",\"div\",null,{\"className\":\"pt-0.5\",\"children\":[[\"$\",\"h4\",null,{\"className\":\"mt-0\",\"children\":\"Step 2: Native Installation\"}],[\"$\",\"div\",null,{\"children\":[[\"$\",\"p\",null,{\"children\":\"After installing the SDK, you need to install pods for iOS and gradle sync android project:\"}],[\"$\",\"div\",null,{\"className\":\"my-5 relative\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute top-3 right-2.5 z-10 sm:block hidden\",\"children\":[\"$\",\"$L28\",null,{\"content\":\"npx pod-install\\n\"}]}],[\"$\",\"div\",null,{\"className\":\"relative\",\"children\":[\"$\",\"pre\",null,{\"className\":\"language-plaintext\",\"children\":[\"$\",\"code\",null,{\"className\":\"language-plaintext code-highlight\",\"children\":[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":\"npx pod-install\\n\"}]}]}]}]]}]]}]]}]]}],[\"$\",\"div\",\".2\",{\"className\":\"border-l pl-9 ml-3 relative pb-5\",\"children\":[[\"$\",\"div\",null,{\"className\":\"bg-muted w-8 h-8 text-xs font-medium rounded-md border flex items-center justify-center absolute -left-4 font-code\",\"children\":3}],[\"$\",\"div\",null,{\"className\":\"pt-0.5\",\"children\":[[\"$\",\"h4\",null,{\"className\":\"mt-0\",\"children\":\"Step 3: Add Stallion bundle support in Android and iOS projects\"}],[\"$\",\"div\",null,{\"children\":[\"$\",\"ul\",null,{\"children\":[\"\\n\",[\"$\",\"li\",null,{\"children\":[\"\\n\",[\"$\",\"p\",null,{\"children\":[[\"$\",\"strong\",null,{\"children\":\"Android\"}],\" - Inside \",[\"$\",\"code\",null,{\"children\":\"MainApplication.java\"}],\", override and implement \",[\"$\",\"code\",null,{\"children\":\"getJSBundleFile\"}],\" method :\"]}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"rehype-code-title\",\"children\":[[\"$\",\"i\",null,{\"className\":\"devicon-java-plain text-[17px] code-icon\"}],\"MainApplication.java\"]}],[\"$\",\"div\",null,{\"className\":\"my-5 relative\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute top-3 right-2.5 z-10 sm:block hidden\",\"children\":[\"$\",\"$L28\",null,{\"content\":\"// ...other imports\\nimport com.stallion.Stallion;\\n\\npublic class MainApplication extends Application implements ReactApplication {\\n  // ...rest of the class\\n  @Override\\n  protected String getJS
142BundleFile() {\\n      return Stallion.getJSBundleFile(getApplicationContext());\\n  }\\n}\\n\"}]}],[\"$\",\"div\",null,{\"className\":\"relative\",\"children\":[\"$\",\"pre\",null,{\"className\":\"language-java\",\"children\":[\"$\",\"code\",null,{\"className\":\"language-java code-highlight\",\"children\":[[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token comment\",\"children\":\"// ...other imports\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"import\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token import\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token namespace\",\"children\":[\"com\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],\"stallion\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}]]}],[\"$\",\"span\",null,{\"className\":\"token class-name\",\"children\":\"Stallion\"}]]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\";\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":\"\\n\"}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"public\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"class\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token class-name\",\"children\":\"MainApplication\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"extends\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token class-name\",\"children\":\"Application\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"implements\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token class-name\",\"children\":\"ReactApplication\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"{\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"  \",[\"$\",\"span\",null,{\"className\":\"token comment\",\"children\":\"// ...rest of the class\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"  \",[\"$\",\"span\",null,{\"className\":\"token annotation punctuation\",\"children\":\"@Override\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"  \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"protected\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token class-name\",\"children\":\"String\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"getJSBundleFile\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"(\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\")\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"{\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"      \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"return\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token class-name\",\"children\":\"Stallion\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"getJSBundleFile\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"(\"}],[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"getApplicationContext\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"(\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\")\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\")\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\";\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"  \",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"}\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"}\"}],\"\\n\"]}]]}]}]}]]}],\"\\n\",[\"$\",\"p\",null,{\"children\":[[\"$\",\"strong\",null,{\"children\":\"If running on latest version of react-native (\u003ev0.76)\"}],\" \",[\"$\",\"br\",null,{}],\"\\n\",\"Inside \",[\"$\",\"code\",null,{\"children\":\"MainApplication.kt\"}],\" file edit the \",[\"$\",\"code\",null,{\"children\":\"reactNativeHost\"}],\" method:\"]}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"rehype-code-title\",\"children\":[[\"$\",\"i\",null,{\"className\":\"devicon-kotlin-plain text-[17px] code-icon\"}],\"MainApplication.kt\"]}],[\"$\",\"div\",null,{\"className\":\"my-5 relative\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute top-3 right-2.5 z-10 sm:block hidden\",\"children\":[\"$\",\"$L28\",null,{\"content\":\"// ...other imports\\nimport com.stallion.Stallion\\n\\n// ...other functions\\noverride val reactNativeHost: ReactNativeHost =\\n  object : DefaultReactNativeHost(this) {\\n    override fun getPackages(): List\u003cReactPackage\u003e =\\n      //other methods...\\n\\n      override fun getJSBundleFile(): String? {\\n          return Stallion.getJSBundleFile(applicationContext)\\n      }\\n  }\\n\"}]}],[\"$\",\"div\",null,{\"className\":\"relative\",\"children\":[\"$\",\"pre\",null,{\"className\":\"language-kotlin\",\"children\":[\"$\",\"code\",null,{\"className\":\"language-kotlin code-highlight\",\"children\":[[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token comment\",\"children\":\"// ...other imports\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"import\"}],\" com\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],\"stallion\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],\"Stallion\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":\"\\n\"}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token comment\",\"children\":\"// ...other functions\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"override\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"val\"}],\" reactNativeHost\",[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\":\"}],\" ReactNativeHost \",[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\"=\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"  \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"object\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\":\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"DefaultReactNativeHost\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"(\"}],[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"this\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\")\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"{\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"    \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"override\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"fun\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"getPackages\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"(\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\")\"}],[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\":\"}],\" List\",[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\"\u003c\"}],\"ReactPackage\",[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\"\u003e\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\"=\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"      \",[\"$\",\"span\",null,{\"className\":\"token comment\",\"children\":\"//other methods...\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":\"\\n\"}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"      \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"override\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"fun\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"getJSBundleFile\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"(\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\")\"}],[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\":\"}],\" String\",[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\"?\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"{\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"          \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"return\"}],\" Stallion\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"getJSBundleFile\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"(\"}],\"applicationContext\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\")\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"      \",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"}\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"  \",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"}\"}],\"\\n\"]}]]}]}]}]]}],\"\\n\",[\"$\",\"p\",null,{\"children\":[[\"$\",\"strong\",null,{\"children\":\"If running on React Native 82 and above\"}],\" \",[\"$\",\"br\",null,{}],\"\\n\",\"Inside \",[\"$\",\"code\",null,{\"children\":\"MainApplication.kt\"}],\" file, override the \",[\"$\",\"code\",null,{\"children\":\"reactHost\"}],\" property:\"]}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"rehype-code-title\",\"children\":[[\"$\",\"i\",null,{\"className\":\"devicon-kotlin-plain text-[17px] code-icon\"}],\"MainApplication.kt\"]}],[\"$\",\"div\",null,{\"className\":\"my-5 relative\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute top-3 right-2.5 z-10 sm:block hidden\",\"children\":[\"$\",\"$L28\",null,{\"content\":\"// ...other imports\\nimport com.facebook.react.ReactHost\\nimport com.facebook.react.defaults.DefaultReactHost.getDefaultReactHost\\nimport com.stallion.Stallion\\n\\nclass MainApplication : Application(), ReactApplication {\\n  override val reactHost: ReactHost by lazy {\\n    getDefaultReactHost(\\n      context = applicationContext,\\n      packageList = PackageList(this).packages,\\n      jsBundleFilePath = Stallion.getJSBundleFile(applicationContext)\\n    )\\n  }\\n}\\n\"}]}],[\"$\",\"div\",null,{\"className\":\"relative\",\"children\":[\"$\",\"pre\",null,{\"className\":\"language-kotlin\",\"children\":[\"$\",\"code\",null,{\"className\":\"language-kotlin code-highlight\",\"children\":[[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token comment\",\"children\":\"// ...other imports\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"import\"}],\" com\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],\"facebook\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],\"react\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],\"ReactHost\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"import\"}],\" com\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],\"facebook\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],\"react\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],\"defaults\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],\"DefaultReactHost\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],\"getDefaultReactHost\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"import\"}],\" com\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],\"stallion\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],\"Stallion\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":\"\\n\"}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"class\"}],\" MainApplication \",[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\":\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"Application\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"(\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\")\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\",\"}],\" ReactApplication \",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"{\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"  \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"override\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"val\"}],\" reactHost\",[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\":\"}],\" ReactHost \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"by\"}],\" lazy \",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"{\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"    \",[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"getDefaultReactHost\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"(\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"      context \",[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\"=\"}],\" applicationContext\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\",\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"      packageList \",[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\"=\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"PackageList\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"(\"}],[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"this\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\")\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],\"packages\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\",\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"      jsBundleFilePath \",[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\"=\"}],\" Stallion\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"getJSBundleFile\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"(\"}],\"applicationContext\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\")\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"    \",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\")\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"  \",[\"$\",\"span\",
142null,{\"className\":\"token punctuation\",\"children\":\"}\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"}\"}],\"\\n\"]}]]}]}]}]]}],\"\\n\"]}],\"\\n\",[\"$\",\"li\",null,{\"children\":[\"\\n\",[\"$\",\"p\",null,{\"children\":[[\"$\",\"strong\",null,{\"children\":\"iOS\"}],\" - Inside \",[\"$\",\"code\",null,{\"children\":\"ios/AppDelegate.mm\"}],\" file edit \",[\"$\",\"code\",null,{\"children\":\"bundleURL\"}],\" method\"]}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"my-5 relative\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute top-3 right-2.5 z-10 sm:block hidden\",\"children\":[\"$\",\"$L28\",null,{\"content\":\"// ...other imports\\n#import \\\"StallionModule.h\\\"\\n\\n@implementation AppDelegate\\n// ...other implemetations\\n- (NSURL *)bundleURL\\n  {\\n    #if DEBUG\\n      return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@\\\"index\\\"];\\n    #else\\n      return [StallionModule getBundleURL];\\n    #endif\\n  }\\n\"}]}],[\"$\",\"div\",null,{\"className\":\"relative\",\"children\":[\"$\",\"pre\",null,{\"className\":\"language-objectivec\",\"children\":[\"$\",\"code\",null,{\"className\":\"language-objectivec code-highlight\",\"children\":[[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token comment\",\"children\":\"// ...other imports\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token macro property\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token directive-hash\",\"children\":\"#\"}],[\"$\",\"span\",null,{\"className\":\"token directive keyword\",\"children\":\"import\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token string\",\"children\":\"\\\"StallionModule.h\\\"\"}]]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":\"\\n\"}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"@implementation\"}],\" AppDelegate\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token comment\",\"children\":\"// ...other implemetations\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\"-\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"(\"}],\"NSURL \",[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\"*\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\")\"}],\"bundleURL\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"  \",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"{\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"    \",[\"$\",\"span\",null,{\"className\":\"token macro property\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token directive-hash\",\"children\":\"#\"}],[\"$\",\"span\",null,{\"className\":\"token directive keyword\",\"children\":\"if\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token expression\",\"children\":\"DEBUG\"}]]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"      \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"return\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"[\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"[\"}],\"RCTBundleURLProvider sharedSettings\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"]\"}],\" jsBundleURLForBundleRoot\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\":\"}],[\"$\",\"span\",null,{\"className\":\"token string\",\"children\":\"@\\\"index\\\"\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"]\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\";\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"    \",[\"$\",\"span\",null,{\"className\":\"token macro property\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token directive-hash\",\"children\":\"#\"}],[\"$\",\"span\",null,{\"className\":\"token directive keyword\",\"children\":\"else\"}]]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"      \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"return\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"[\"}],\"StallionModule getBundleURL\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"]\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\";\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"    \",[\"$\",\"span\",null,{\"className\":\"token macro property\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token directive-hash\",\"children\":\"#\"}],[\"$\",\"span\",null,{\"className\":\"token directive keyword\",\"children\":\"endif\"}]]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"  \",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"}\"}],\"\\n\"]}]]}]}]}]]}],\"\\n\",[\"$\",\"p\",null,{\"children\":[[\"$\",\"strong\",null,{\"children\":\"If running on latest version of react-native (\u003ev0.76)\"}],\" \",[\"$\",\"br\",null,{}],\"\\n\",\"Inside \",[\"$\",\"code\",null,{\"children\":\"ios/AppDelegate.swift\"}],\" file edit the \",[\"$\",\"code\",null,{\"children\":\"bundleURL\"}],\" method:\"]}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"my-5 relative\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute top-3 right-2.5 z-10 sm:block hidden\",\"children\":[\"$\",\"$L28\",null,{\"content\":\"// ...other imports\\nimport react_native_stallion\\n\\n// ...other functions\\noverride func bundleURL() -\u003e URL? {\\n    #if DEBUG\\n        RCTBundleURLProvider.sharedSettings().jsBundleURL(forBundleRoot: \\\"index\\\")\\n    #else\\n        StallionModule.getBundleURL()\\n    #endif\\n}\\n\"}]}],[\"$\",\"div\",null,{\"className\":\"relative\",\"children\":[\"$\",\"pre\",null,{\"className\":\"language-swift\",\"children\":[\"$\",\"code\",null,{\"className\":\"language-swift code-highlight\",\"children\":[[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token comment\",\"children\":\"// ...other imports\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"import\"}],\" react_native_stallion\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":\"\\n\"}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token comment\",\"children\":\"// ...other functions\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"override\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token keyword\",\"children\":\"func\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token function-definition function\",\"children\":\"bundleURL\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"(\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\")\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\"-\u003e\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token constant\",\"children\":\"URL\"}],[\"$\",\"span\",null,{\"className\":\"token operator\",\"children\":\"?\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"{\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"    \",[\"$\",\"span\",null,{\"className\":\"token directive property\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token directive-name\",\"children\":\"#if\"}],\" DEBUG\"]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"        \",[\"$\",\"span\",null,{\"className\":\"token class-name\",\"children\":\"RCTBundleURLProvider\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"sharedSettings\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"(\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\")\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"jsBundleURL\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"(\"}],\"forBundleRoot\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\":\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token string-literal\",\"children\":[\"$\",\"span\",null,{\"className\":\"token string\",\"children\":\"\\\"index\\\"\"}]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\")\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"    \",[\"$\",\"span\",null,{\"className\":\"token directive property\",\"children\":[\"$\",\"span\",null,{\"className\":\"token directive-name\",\"children\":\"#else\"}]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"        \",[\"$\",\"span\",null,{\"className\":\"token class-name\",\"children\":\"StallionModule\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\".\"}],[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"getBundleURL\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"(\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\")\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"    \",[\"$\",\"span\",null,{\"className\":\"token directive property\",\"children\":[\"$\",\"span\",null,{\"className\":\"token directive-name\",\"children\":\"#endif\"}]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"}\"}],\"\\n\"]}]]}]}]}]]}],\"\\n\"]}],\"\\n\"]}]}]]}]]}],[\"$\",\"div\",\".3\",{\"className\":\"border-l pl-9 ml-3 relative pb-5\",\"children\":[[\"$\",\"div\",null,{\"className\":\"bg-muted w-8 h-8 text-xs font-medium rounded-md border flex items-center justify-center absolute -left-4 font-code\",\"children\":4}],[\"$\",\"div\",null,{\"className\":\"pt-0.5\",\"children\":[[\"$\",\"h4\",null,{\"className\":\"mt-0\",\"children\":\"Step 4: Add ProjectId \u0026 AppToken in native\"}],[\"$\",\"div\",null,{\"children\":[[\"$\",\"ul\",null,{\"children\":[\"\\n\",[\"$\",\"li\",null,{\"children\":[\"\\n\",[\"$\",\"p\",null,{\"children\":[[\"$\",\"strong\",null,{\"children\":\"Get projectID from Stallion Dashboard :\"}],\"\\nOn project info page, copy project id.\\n\",[\"$\",\"$L11\",null,{\"src\":\"https://assets.stalliontech.io/project_id.png\",\"alt\":\"Alt text for the image\",\"width\":800,\"height\"
142:350,\"quality\":40}]]}],\"\\n\"]}],\"\\n\",[\"$\",\"li\",null,{\"children\":[\"\\n\",[\"$\",\"p\",null,{\"children\":[[\"$\",\"strong\",null,{\"children\":\"Generate App Token :\"}],\"\\nNavigate to \",[\"$\",\"code\",null,{\"children\":\"Project \u003e Project Settings \u003e Access Tokens\"}],\", and select \",[\"$\",\"code\",null,{\"children\":\"Generate\"}],\" or \",[\"$\",\"code\",null,{\"children\":\"Regenerate App\"}],\" Token to create a new token.\\n\",[\"$\",\"$L11\",null,{\"src\":\"https://assets.stalliontech.io/gen_app_token.png\",\"alt\":\"Alt text for the image\",\"width\":800,\"height\":350,\"quality\":40}]]}],\"\\n\"]}],\"\\n\"]}],[\"$\",\"p\",null,{\"children\":[\"Add \",[\"$\",\"code\",null,{\"children\":\"StallionProjectId\"}],\" \u0026 \",[\"$\",\"code\",null,{\"children\":\"StallionAppToken\"}],\" as shown below -\"]}],[\"$\",\"ul\",null,{\"children\":[\"\\n\",[\"$\",\"li\",null,{\"children\":[\"\\n\",[\"$\",\"p\",null,{\"children\":[[\"$\",\"strong\",null,{\"children\":\"iOS\"}],\": Add the copied App Token and projectId to \",[\"$\",\"code\",null,{\"children\":\"info.plist\"}]]}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"my-5 relative\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute top-3 right-2.5 z-10 sm:block hidden\",\"children\":[\"$\",\"$L28\",null,{\"content\":\"\u003cplist version=\\\"1.0\\\"\u003e\\n  \u003cdict\u003e\\n    \u003c!-- ...other configs... --\u003e\\n    \u003ckey\u003eStallionProjectId\u003c/key\u003e\\n    \u003cstring\u003e66ed03380eb95c9c316256d3\u003c/string\u003e\\n    \u003c!-- make sure app token starts with spb_... and is 46 characters long --\u003e\\n    \u003ckey\u003eStallionAppToken\u003c/key\u003e\\n    \u003cstring\u003espb_FTLx5umZgKLTEyiMNf9-81BgANTOvx7pNhA-gFXbg9\u003c/string\u003e\\n    \u003c!-- ...other configs... --\u003e\\n  \u003c/dict\u003e\\n\u003c/plist\u003e\\n\"}]}],[\"$\",\"div\",null,{\"className\":\"relative\",\"children\":[\"$\",\"pre\",null,{\"className\":\"language-xml\",\"children\":[\"$\",\"code\",null,{\"className\":\"language-xml code-highlight\",\"children\":[[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c\"}],\"plist\"]}],\" \",[\"$\",\"span\",null,{\"className\":\"token attr-name\",\"children\":\"version\"}],[\"$\",\"span\",null,{\"className\":\"token attr-value\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation attr-equals\",\"children\":\"=\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\\\"\"}],\"1.0\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\\\"\"}]]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"  \",[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c\"}],\"dict\"]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"    \",[\"$\",\"span\",null,{\"className\":\"token comment\",\"children\":\"\u003c!-- ...other configs... --\u003e\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"    \",[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c\"}],\"key\"]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"StallionProjectId\",[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c/\"}],\"key\"]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"    \",[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c\"}],\"string\"]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"66ed03380eb95c9c316256d3\",[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c/\"}],\"string\"]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"    \",[\"$\",\"span\",null,{\"className\":\"token comment\",\"children\":\"\u003c!-- make sure app token starts with spb_... and is 46 characters long --\u003e\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"    \",[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c\"}],\"key\"]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"StallionAppToken\",[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c/\"}],\"key\"]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"    \",[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c\"}],\"string\"]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"spb_FTLx5umZgKLTEyiMNf9-81BgANTOvx7pNhA-gFXbg9\",[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c/\"}],\"string\"]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"    \",[\"$\",\"span\",null,{\"className\":\"token comment\",\"children\":\"\u003c!-- ...other configs... --\u003e\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"  \",[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c/\"}],\"dict\"]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c/\"}],\"plist\"]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"\\n\"]}]]}]}]}]]}],\"\\n\",[\"$\",\"p\",null,{\"children\":[\"$\",\"$L11\",null,{\"src\":\"https://assets.stalliontech.io/ios_info_plist.png\",\"alt\":\"Alt text for the image\",\"width\":800,\"height\"
142:350,\"quality\":40}]}],\"\\n\"]}],\"\\n\",[\"$\",\"li\",null,{\"children\":[\"\\n\",[\"$\",\"p\",null,{\"children\":[[\"$\",\"strong\",null,{\"children\":\"android\"}],\": Add the copied App Token and projectId to \",[\"$\",\"code\",null,{\"children\":\"strings.xml\"}]]}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"my-5 relative\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute top-3 right-2.5 z-10 sm:block hidden\",\"children\":[\"$\",\"$L28\",null,{\"content\":\"\u003cresources\u003e\\n  \u003cstring name=\\\"app_name\\\"\u003emy_app\u003c/string\u003e\\n  \u003c!-- make sure app token starts with spb_... and is 46 characters long --\u003e\\n  \u003cstring name=\\\"StallionProjectId\\\"\u003e66ed03380eb95c9c316256d3\u003c/string\u003e\\n  \u003cstring name=\\\"StallionAppToken\\\"\u003espb_FTLx5umZgKLTEyiMNf9-81BgANTOvx7pNhA-gFXbg9\u003c/string\u003e\\n\u003c/resources\u003e\\n\"}]}],[\"$\",\"div\",null,{\"className\":\"relative\",\"children\":[\"$\",\"pre\",null,{\"className\":\"language-xml\",\"children\":[\"$\",\"code\",null,{\"className\":\"language-xml code-highlight\",\"children\":[[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c\"}],\"resources\"]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"  \",[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c\"}],\"string\"]}],\" \",[\"$\",\"span\",null,{\"className\":\"token attr-name\",\"children\":\"name\"}],[\"$\",\"span\",null,{\"className\":\"token attr-value\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation attr-equals\",\"children\":\"=\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\\\"\"}],\"app_name\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\\\"\"}]]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"my_app\",[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c/\"}],\"string\"]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"  \",[\"$\",\"span\",null,{\"className\":\"token comment\",\"children\":\"\u003c!-- make sure app token starts with spb_... and is 46 characters long --\u003e\"}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"  \",[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c\"}],\"string\"]}],\" \",[\"$\",\"span\",null,{\"className\":\"token attr-name\",\"children\":\"name\"}],[\"$\",\"span\",null,{\"className\":\"token attr-value\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation attr-equals\",\"children\":\"=\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\\\"\"}],\"StallionProjectId\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\\\"\"}]]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"66ed03380eb95c9c316256d3\",[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c/\"}],\"string\"]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[\"  \",[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c\"}],\"string\"]}],\" \",[\"$\",\"span\",null,{\"className\":\"token attr-name\",\"children\":\"name\"}],[\"$\",\"span\",null,{\"className\":\"token attr-value\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation attr-equals\",\"children\":\"=\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\\\"\"}],\"StallionAppToken\",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\\\"\"}]]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"spb_FTLx5umZgKLTEyiMNf9-81BgANTOvx7pNhA-gFXbg9\",[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c/\"}],\"string\"]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"\\n\"]}],[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token tag\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003c/\"}],\"resources\"]}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"\u003e\"}]]}],\"\\n\"]}]]}]}]}]]}],\"\\n\",[\"$\",\"p\",null,{\"children\":[\"$\",\"$L11\",null,{\"src\":\"https://assets.stalliontech.io/android_strings_xml.png\",\"alt\":\"Alt text for the image\",\"width\":800,\"height\"
142:350,\"quality\":40}]}],\"\\n\"]}],\"\\n\"]}]]}]]}]]}],[\"$\",\"div\",\".4\",{\"className\":\"border-l pl-9 ml-3 relative\",\"children\":[[\"$\",\"div\",null,{\"className\":\"bg-muted w-8 h-8 text-xs font-medium rounded-md border flex items-center justify-center absolute -left-4 font-code\",\"children\":5}],[\"$\",\"div\",null,{\"className\":\"pt-0.5\",\"children\":[[\"$\",\"h4\",null,{\"className\":\"mt-0\",\"children\":\"Step 5: Import and add Stallion as HOC in App.js\"}],[\"$\",\"div\",null,{\"children\":[\"$\",\"ul\",null,{\"children\":[\"\\n\",[\"$\",\"li\",null,{\"children\":[\"Import \",[\"$\",\"code\",null,{\"children\":\"withStallion\"}],\" HOC\",\"\\n\",[\"$\",\"div\",null,{\"className\":\"my-5 relative\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute top-3 right-2.5 z-10 sm:block hidden\",\"children\":[\"$\",\"$L28\",null,{\"content\":\"import { withStallion } from 'react-native-stallion';\\n\"}]}],[\"$\",\"div\",null,{\"className\":\"relative\",\"children\":[\"$\",\"pre\",null,{\"className\":\"language-javascript\",\"children\":[\"$\",\"code\",null,{\"className\":\"language-javascript code-highlight\",\"children\":[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token keyword module\",\"children\":\"import\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token imports\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"{\"}],\" withStallion \",[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"}\"}]]}],\" \",[\"$\",\"span\",null,{\"className\":\"token keyword module\",\"children\":\"from\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token string\",\"children\":\"'react-native-stallion'\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\";\"}],\"\\n\"]}]}]}]}]]}],\"\\n\"]}],\"\\n\",[\"$\",\"li\",null,{\"children\":[\"Wrap root component (generally App.tsx or App.js) with HOC\",\"\\n\",[\"$\",\"div\",null,{\"className\":\"my-5 relative\",\"children\":[[\"$\",\"div\",null,{\"className\":\"absolute top-3 right-2.5 z-10 sm:block hidden\",\"children\":[\"$\",\"$L28\",null,{\"content\":\"export default withStallion(App)\\
142n\"}]}],[\"$\",\"div\",null,{\"className\":\"relative\",\"children\":[\"$\",\"pre\",null,{\"className\":\"language-javascript\",\"children\":[\"$\",\"code\",null,{\"className\":\"language-javascript code-highlight\",\"children\":[\"$\",\"span\",null,{\"className\":\"code-line\",\"children\":[[\"$\",\"span\",null,{\"className\":\"token keyword module\",\"children\":\"export\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token keyword module\",\"children\":\"default\"}],\" \",[\"$\",\"span\",null,{\"className\":\"token function\",\"children\":\"withStallion\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\"(\"}],[\"$\",\"span\",null,{\"className\":\"token maybe-class-name\",\"children\":\"App\"}],[\"$\",\"span\",null,{\"className\":\"token punctuation\",\"children\":\")\"}],\"\\n\"]}]}]}]}]]}],\"\\n\"]}],\"\\n\"]}]}]]}]]}]]}],\"\\n\",[\"$\",\"p\",null,{\"children\":\"With this setup, you’ll have installed Stallion. I next section we will see how to use Stallion to deploy bundles and get realtime updates.\"}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"border rounded-md px-5 pb-0.5 mt-5 mb-7 text-sm tracking-wide dark:bg-yellow-950 bg-orange-100 border-orange-200 dark:border-yellow-900\",\"children\":[false,[[\"$\",\"p\",null,{\"className\":\"font-bold -mb-2.5\",\"children\":[\"Remember\",\":\"]}],\" \",[\"$\",\"p\",null,{\"children\":\"After installing Stallion in your React Native app, make sure to publish a\\nbuild (APK or TestFlight) with Stallion fully integrated. This is essential to\\ntest and verify that OTA updates are being correctly installed via Stallion.\\nNote: If you're running your app in development mode connected to the Metro\\nbundler, Stallion's OTA changes will not be applied. To properly test OTA\\nupdates, you must use a published app build.\"}]]]}]]}],[\"$\",\"div\",null,{\"className\":\"grid grid-cols-2 flex-grow sm:py-10 py-7 gap-3\",\"children\":[[\"$\",\"div\",null,{\"children\":[\"$\",\"$L10\",null,{\"className\":\"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border border-input bg-background hover:bg-accent hover:text-accent-foreground h-10 px-4 py-2 no-underline w-full flex flex-col pl-3 !py-8 !items-start\",\"href\":\"/docs/expo-integration-with-stallion\",\"children\":[[\"$\",\"span\",null,{\"className\":\"flex items-center text-muted-foreground text-xs\",\"children\":[[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-chevron-left w-[1rem] h-[1rem] mr-1\",\"children\":[[\"$\",\"path\",\"1wnfg3\",{\"d\":\"m15 18-6-6 6-6\"}],\"$undefined\"]}],\"Previous\"]}],[\"$\",\"span\",null,{\"className\":\"mt-1 ml-1\",\"children\":\"Expo Integration\"}]]}]}],[\"$\",\"div\",null,{\"children\":[\"$\",\"$L10\",null,{\"className\":\"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border border-input bg-background hover:bg-accent hover:text-accent-foreground h-10 px-4 py-2 no-underline w-full flex flex-col pr-3 !py-8 !items-end\",\"href\":\"/docs/sdk/production-usage\",\"children\":[[\"$\",\"span\",null,{\"className\":\"flex items-center text-muted-foreground text-xs\",\"children\":[\"Next\",[\"$\",\"svg\",null,{\"ref\":\"$undefined\",\"xmlns\":\"http://www.w3.org/2000/svg\",\"width\":24,\"height\":24,\"viewBox\":\"0 0 24 24\",\"fill\":\"none\",\"stroke\":\"currentColor\",\"strokeWidth\":2,\"strokeLinecap\":\"round\",\"strokeLinejoin\":\"round\",\"className\":\"lucide lucide-chevron-right w-[1rem] h-[1rem] ml-1\",\"children\":[[\"$\",\"path\",\"mthhwq\",{\"d\":\"m9 18 6-6-6-6\"}],\"$undefined\"]}]]}],[\"$\",\"span\",null,{\"className\":\"mt-1 mr-1\",\"children\":\"Production Usage\"}]]}]}]]}]]}]]}],\"$L29\"]}]]\n"])</script>
142<script>self.__next_f.push([1,"2a:I[3392,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"140\",\"static/chunks/140-38b38c63288b6c5d.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-4f333ec4fedcfb8c.js\"],\"ScrollArea\"]\n2b:I[157,[\"839\",\"static/chunks/839-491be9e7f5652a05.js\",\"365\",\"static/chunks/365-a52c3d1c3aa311cc.js\",\"23\",\"static/chunks/23-90641466f3bb2795.js\",\"531\",\"static/chunks/531-45f60e11e2b10d1b.js\",\"178\",\"static/chunks/178-cc4608b502ffc181.js\",\"140\",\"static/chunks/140-38b38c63288b6c5d.js\",\"870\",\"static/chunks/app/docs/%5B%5B...slug%5D%5D/page-4f333ec4fedcfb8c.js\"],\"default\"]\n29:[\"$\",\"div\",null,{\"className\":\"lg:flex hidden toc flex-[1.5] min-w-[238px] py-9 sticky top-16 h-[96.95vh]\",\"children\":[\"$\",\"div\",null,{\"className\":\"flex flex-col gap-3 w-full pl-2\",\"children\":[[\"$\",\"h3\",null,{\"className\":\"font-medium text-sm\",\"children\":\"On this page\"}],[\"$\",\"$L2a\",null,{\"className\":\"pb-2 pt-0.5 overflow-y-auto\",\"children\":[\"$\",\"$L2b\",null,{\"data\":[{\"level\":3,\"text\":\"SDK Installation\",\"href\":\"#sdk-installation\"}]}]}]]}]}]\n"])</script>
142</body></html>

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.