CINXE.COM
RunKit
<!DOCTYPE html><html><head><meta name="viewport" content="width=device-width, user-scalable=no"/><meta name="keywords" content="REPL runkit tonic playground javascript node npm module prototype prototyping API server"/><meta name="author" content="runkit.com"/><meta name="description" content="RunKit notebooks are interactive javascript playgrounds connected to a complete node environment right in your browser. Every npm module pre-installed."/><link type="application/opensearchdescription+xml" rel="search" href="https://static.runkitcdn.com/search.xml"/><link href="https://fonts.googleapis.com/css?family=Fira+Sans:400,400i,700,700i|Ubuntu+Mono:400" rel="stylesheet"/><link rel="stylesheet" type="text/css" href="https://static.runkitcdn.com/assets/vendor/bootstrap/bootstrap-sha512-tDXPcamuZsWWd6OsKFyH6nAqh_MjZ_5Yk88T5o+aMfygqNFPan1pLyPFAndRzmOWHKT+jSDzWpJv8krj6x1LMA==.min.css" integrity="sha512-tDXPcamuZsWWd6OsKFyH6nAqh/MjZ/5Yk88T5o+aMfygqNFPan1pLyPFAndRzmOWHKT+jSDzWpJv8krj6x1LMA==" crossorigin="anonymous"/><link rel="stylesheet" type="text/css" href="https://static.runkitcdn.com/assets/vendor/font-awesome/css/font-awesome-sha512-SfTiTlX6kk+qitfevl_7LibUOeJWlt9rbyDn92a1DqWOw9vWG2MFoays0sgObmWazO5BQPiFucnnEAjpAB+_Sw==.min.css" integrity="sha512-SfTiTlX6kk+qitfevl/7LibUOeJWlt9rbyDn92a1DqWOw9vWG2MFoays0sgObmWazO5BQPiFucnnEAjpAB+/Sw==" crossorigin="anonymous"/><link rel="stylesheet" type="text/css" href="https://static.runkitcdn.com/assets/styles/base-sha512-JJhyit1rR09PVXP+QrvQFLhZEfqp6+NWtO1rnlzKWmb1pD_Kdq2OZ0dfE69CmGq2HgNzjHNwZ7dLDdc1oIC1hQ==.css" integrity="sha512-JJhyit1rR09PVXP+QrvQFLhZEfqp6+NWtO1rnlzKWmb1pD/Kdq2OZ0dfE69CmGq2HgNzjHNwZ7dLDdc1oIC1hQ==" crossorigin="anonymous"/><link rel="stylesheet" type="text/css" href="https://static.runkitcdn.com/assets/styles/codemirror-sha512-7vaQ4LLdaXd2IuMd4MUQ6LRFIGbEwJI1aq6KYqL3RjbdQyUkRFhwZKmqmkBXurTFdGlx687lTN8FSJfX6Df8Gw==.css" integrity="sha512-7vaQ4LLdaXd2IuMd4MUQ6LRFIGbEwJI1aq6KYqL3RjbdQyUkRFhwZKmqmkBXurTFdGlx687lTN8FSJfX6Df8Gw==" crossorigin="anonymous"/><link href="https://themes.runkitcdn.com/runkit-light.css?v=ce0f1cbf00545d68f7a212bb4a3cb3a4aac49d35" rel="stylesheet" type="text/css"/><link rel="stylesheet" type="text/css" href="https://static.runkitcdn.com/assets/styles/static-sha512-qOEI+il_46N_1TZNKAZS8IfXZ+vPIEcU+9VTUwWBbWx1PlgZIwxmA3YB_hDYaM4GIRIWAvwftdZxbpqdMBppLg==.css" integrity="sha512-qOEI+il/46N/1TZNKAZS8IfXZ+vPIEcU+9VTUwWBbWx1PlgZIwxmA3YB/hDYaM4GIRIWAvwftdZxbpqdMBppLg==" crossorigin="anonymous"/><link rel="stylesheet" type="text/css" href="https://static.runkitcdn.com/assets/vendor/photon/icons-sha512-4pURzInKvIGq8AfiVX2AFrOL3Amo9X_wfnhZFdNLab9NClylJ1Txa39ilHDhlP+DI8N__qKKC9q3jKEGP1xxBQ==.min.css" integrity="sha512-4pURzInKvIGq8AfiVX2AFrOL3Amo9X/wfnhZFdNLab9NClylJ1Txa39ilHDhlP+DI8N//qKKC9q3jKEGP1xxBQ==" crossorigin="anonymous"/><script type="text/javascript" src="https://static.runkitcdn.com/assets/theme-preview.bundle.js" integrity="sha512-STVFiL2BvJQJmyj9oSAdl/uHK13jHV5fgN7Ib35vjlGsEmoYq10nUlKJ3xwNqGys9OyAt4F61Ym41of05keDXg==" crossorigin="anonymous"></script><title>RunKit</title></head><body><style data-aphrodite>._1x986e2{padding:20px 50px !important;max-width:810px !important;}._10lnp7s{border-bottom:1px solid rgba(54, 89, 125, 0.05);}._1d2af4v{overflow:hidden;margin-bottom:60px;margin-right:60px;border-radius:10pt;background-color:#fff;box-shadow:0 1px 1px rgba(0, 0, 0, 0.1), 0 8px 16px rgba(0, 0, 0, 0.05);display:block;-webkit-transition:box-shadow 0.3s ease;-moz-transition:box-shadow 0.3s ease;transition:box-shadow 0.3s ease;text-align:center;color:#111;}._194a634{background:#fff;padding:10pt;}._a0d0yi{display:table-cell;float:none;}._1af0wdq{padding:2pt 0;}</style><div id = "react-container"><div data-reactroot=""><script src="https://embed.runkit.com"></script><link href="https://fonts.googleapis.com/css?family=Roboto:300,400,700" rel="stylesheet" type="text/css"/><div><div class="static-page"><header><nav class="primary-nav navbar navbar-expand navbar-light"><div class="container" style="text-shadow:none;border-bottom:1px solid rgba(255, 255, 255, 0.1)"><ul class="navbar-nav mr-auto"><li class="nav-item"><a class="logo navbar-brand" href="/home">RunKit</a></li></ul><ul style="justify-content:space-between;width:100%" class="navbar-nav secondary-links"><div id="expandable" class="collapse navbar-collapse"></div><div class="navbar-nav "><ul id="expandable" class="navbar-nav secondary-links text-right navbar-right"><li class="nav-item"><a class="nav-link" href="https://discuss.runkit.com">Forum</a></li><li class="nav-item"><a class="nav-link" href="http://blog.runkit.com/">Blog</a></li><li class="nav-item"><a class="nav-link" href="/docs">Documentation</a></li><li class="nav-item"><a class="nav-link" href="/explore">Explore</a></li></ul><div class="navbar-user-menu-container"><li class="nav-item"><a class="nav-link" href="/login"><span class="signin">Sign in</span></a></li><button class="navbar-toggler" type="button" data-toggle="collapse" data-target="expandable"><span class="navbar-toggler-icon"></span></button></div></div></ul></div></nav></header><div class="main-content"><div><div class="container _1x986e2"><main class="_a0d0yi"><section id="runkit-embed" class="_1af0wdq"><div><h2>RunKit Embed</h2><h3>Embed node.js on any website</h3></div><hr/><p>It’s easy to embed RunKit on any website. The embedded version of a RunKit notebook has a single executable code cell. It will grow and shrink vertically to fit its content, and fill its container horizontally. You can have as many instances as you like on a given page.</p><h3>Table of Contents</h3><ul><li><a href="#common-use-cases">Common use cases</a><ol><li><a href="#attach">Attaching RunKit to an existing element</a></li><li><a href="#code">Programmatically creating an Embed</a></li></ol></li><li><a href="#embed-api">Embed API</a></li><li><a href="#examples">Examples</a></li><li><a href="#bindings">Bindings (React, Angular, Ember)</a></li><li><a href="#oembed">OEmbed</a></li><li><a href="#showcase">Showcase</a></li></ul></section><section id="common-use-cases" class="_1af0wdq"><div><h2>Common use cases</h2></div><p>There are two ways to get RunKit on your page, described below. In both cases, you want to include: <br/><code><script src="https://embed.runkit.com"></script></code></p><br/><h3 id="attach">1. Attaching RunKit to an existing element</h3><p>This is the easiest way to embed RunKit. Just include one script tag, and let it know which element contains the source code you want to attach to with the<!-- --> <code>data-element-id</code> attribute.</p><div style="margin-bottom:40px"><div style="height:inherit;max-width:710px;margin-bottom:20px" class="source-editor"><textarea placeholder=""></textarea><div class="prerender" style="display:block"><div><h3 style="text-align: center;">Welcome to my website</h3> <script src="https://embed.runkit.com" data-element-id="my-element"></script> <!-- anywhere else on your page --> <div id="my-element">// GeoJSON! var getJSON = require("async-get-json"); await getJSON("https://storage.googleapis.com/maps-devrel/google.json");</div> </div></div><div class="gutter" style="display:block"></div></div></div><br/><h3 id="code">2. Programmatically creating an Embed</h3><p>You can also create an embedded notebook programmatically. Just include the same script tag, then call<!-- --> <code>RunKit.createNotebook</code>.</p><div style="margin-bottom:40px"><div style="height:inherit;max-width:710px;margin-bottom:20px" class="source-editor"><textarea placeholder=""></textarea><div class="prerender" style="display:block"><div><h3 style="text-align: center;">Welcome to my website</h3> <script src="https://embed.runkit.com"></script> <div id="my-element"></div> <script>var notebook = RunKit.createNotebook({ // the parent element for the new notebook element: document.getElementById("my-element"), // specify the source of the notebook source: "// GeoJSON!\nvar getJSON = require(\"async-get-json\");\n\nawait getJSON(\"https://storage.googleapis.com/maps-devrel/google.json\");" })</script> </div></div><div class="gutter" style="display:block"></div></div></div></section><section id="embed-api" class="_1af0wdq"><div><h2>Embed API</h2></div><style> #embed-api .cm-comment { color: #9d89a1; } #embed-api .cm-property { color: #6e317e; } #embed-api .cm-variable { color: #6e317e; } #embed-api .cm-type { color: #bd4d86; } #embed-api .cm-keyword { color: #381242; } </style><p>The RunKit <code><script></code> tag adds a<code>RunKit</code> object to the global namespace, which looks like this (as a <a href="https://www.typescriptlang.org/">TypeScript</a> type definition):</p><div style="margin-bottom:20px" class=" cm-read-only"><textarea readonly="" placeholder=""></textarea><div class="prerender" style="display:block"><div>interface GlobalRunKit { createNotebook: (options: EmbedOptions) => NotebookEmbed } </div></div><div class="gutter" style="display:block"></div></div><p><code>RunKit.createNotebook</code> creates an embedded notebook using the provided options, and returns a<code>NotebookEmbed</code> object. The options are (again, as a <a href="https://www.typescriptlang.org/">TypeScript</a> type definition):</p><div style="margin-bottom:20px" class=" cm-read-only"><textarea readonly="" placeholder=""></textarea><div class="prerender" style="display:block"><div>// A semver range as a string. For example: "10.1.x" or "12.x.x". // See https://docs.npmjs.com/about-semantic-versioning type semverRange = string // A string that represents CSS Pixels. A string that has a number with the 'px' // suffix. For example: "10px". // See https://developer.mozilla.org/en-US/docs/Glossary/CSS_pixel type cssPxString = string interface EmbedOptions { element: HTMLElement // Parent element for the new notebook // Environment variables for the execution environment. Available under // `process.env`. Defaults to [] environment?: Array<{name: string, value: string}> evaluateOnLoad?: boolean // Evaluate the Embed when it finishes loading. // Where the line numbers should appear. Defaults to "outside" gutterStyle?: "inside" | "none" | "outside" // Hides the "▶ Run" button. In Endpoint mode, Hides the endpoint URL. hidesActionButton?: boolean // In Endpoint mode, Hides the logs that would appear when hitting the Endpoint. // See https://runkit.com/docs/endpoint. hidesEndpointLogs?: boolean // Minimum height of the embed in pixels. E.g. "100px". Defaults to "73px" minHeight?: cssPxString // When in default mode RunKit Embeds behave like a regular notebook and display // outputs after each evaluation. When the Embed is in endpoint mode the outputs // are replaced by endpoint logs and a URL is provided to run the Embed code. See // https://runkit.com/docs/endpoint. Defaults to "default" mode?: "endpoint" | "default" // A semver range that the node engine should satisfy, e.g. "4.0.x" or "> // 6.9.2". Defaults to "10.x.x" nodeVersion?: semverRange source?: string // The source code of the Embed. // The timestamp in UTC milliseconds to recreate the state of package // availability. No packages published to npm after this time are available in this // embed. Useful for reproducing bugs, or guaranteeing dependency versions. By // default the timestamp is set to the time the embed is created. packageTimestamp?: number | null // Code in the preamble field will not be displayed in the embed, but will be // executed before running the code in the embed. For example, libraries that use // RunKit for documentation often require their package in the preamble to avoid // clutter in the embed code. preamble?: string readOnly?: boolean tabSize?: number // An Integer Minimum of 0 Defaults to 4 title?: string // The title of the RunKit Notebook when it is saved on RunKit. } </div></div><div class="gutter" style="display:block"></div></div><p>The <code>key?: value</code> syntax above means that the key is <a href="https://www.typescriptlang.org/docs/handbook/interfaces.html#optional-properties">optional.</a></p><p>The <code>NotebookEmbed</code> object returned by<code>RunKit.createNotebook</code> has the following interface: (Note that the getters and setters are all async and return <code>Promises</code>. This is because they travel across an iframe.)</p><div style="margin-bottom:20px" class=" cm-read-only"><textarea readonly="" placeholder=""></textarea><div class="prerender" style="display:block"><div>interface NotebookEmbed { /// Methods destroy: () => void evaluate: () => void /// Events onEvaluate: () => void // Called when a cell is evaluated. // Called when the Embed has fully loaded. The function will be passed a // reference to the Embed. onLoad: (arg: NotebookEmbed) => void // Called when the embed cell is resized. onResize: (arg: {height: number}) => void onSave: () => void // Called when the embed is saved. // Called when the shareable URL or endpoint URL changes. onURLChanged: (arg: {shareableURL: string, endpointURL: string}) => void /// Properties // endpointURL // In Endpoint mode, this is the url that will run this code // when visited. See https://runkit.com/docs/endpoint. getEndpointURL: () => Promise<string> // environment // Environment variables for the execution environment. // Available under `process.env`. Defaults to [] getEnvironment: () => Promise<Array<{name: string, value: string}>> setEnvironment: (environment: Array<{name: string, value: string}>) => Promise<undefined> // evaluateOnLoad // Evaluate the Embed when it finishes loading. getEvaluateOnLoad: () => Promise<boolean> // gutterStyle // Where the line numbers should appear. Defaults to "outside" getGutterStyle: () => Promise<"inside" | "none" | "outside"> setGutterStyle: (gutterStyle: "inside" | "none" | "outside") => Promise<undefined> // hidesActionButton // Hides the "▶ Run" button. In Endpoint mode, Hides the endpoint URL. getHidesActionButton: () => Promise<boolean> setHidesActionButton: (hidesActionButton: boolean) => Promise<undefined> // hidesEndpointLogs // In Endpoint mode, Hides the logs that would appear when // hitting the Endpoint. See https://runkit.com/docs/endpoint. getHidesEndpointLogs: () => Promise<boolean> setHidesEndpointLogs: (hidesEndpointLogs: boolean) => Promise<undefined> // minHeight // Minimum height of the embed in pixels. E.g. "100px". Defaults to "73px" getMinHeight: () => Promise<cssPxString> setMinHeight: (minHeight: cssPxString) => Promise<undefined> // mode // When in default mode RunKit Embeds behave like a regular notebook // and display outputs after each evaluation. When the Embed is in endpoint mode // the outputs are replaced by endpoint logs and a URL is provided to run the Embed // code. See https://runkit.com/docs/endpoint. Defaults to "default" getMode: () => Promise<"endpoint" | "default"> setMode: (mode: "endpoint" | "default") => Promise<undefined> // nodeVersion // A semver range that the node engine should satisfy, e.g. // "4.0.x" or "> 6.9.2". Defaults to "10.x.x" getNodeVersion: () => Promise<semverRange> setNodeVersion: (nodeVersion: semverRange) => Promise<undefined> // source getSource: () => Promise<string> // The source code of the Embed. setSource: (source: string) => Promise<undefined> // packageTimestamp // The timestamp in UTC milliseconds to recreate the state // of package availability. No packages published to npm after this time are // available in this embed. Useful for reproducing bugs, or guaranteeing dependency // versions. By default the timestamp is set to the time the embed is created. getPackageTimestamp: () => Promise<number | null> setPackageTimestamp: (packageTimestamp: number | null) => Promise<undefined> // preamble // Code in the preamble field will not be displayed in the embed, // but will be executed before running the code in the embed. For example, // libraries that use RunKit for documentation often require their package in the // preamble to avoid clutter in the embed code. getPreamble: () => Promise<string> setPreamble: (preamble: string) => Promise<undefined> // readOnly getReadOnly: () => Promise<boolean> setReadOnly: (readOnly: boolean) => Promise<undefined> // shareableURL // A URL that can be used to share the Embed with other users. getShareableURL: () => Promise<string> // requirePath // A path that can be used to require this Embed as a module in // other Embeds or RunKit Notebook. getRequirePath: () => Promise<string> // tabSize getTabSize: () => Promise<number> // An Integer Minimum of 0 Defaults to 4 setTabSize: (tabSize: number) => Promise<undefined> // title // The title of the RunKit Notebook when it is saved on RunKit. getTitle: () => Promise<string> setTitle: (title: string) => Promise<undefined> } </div></div><div class="gutter" style="display:block"></div></div><p>You can integrate these types into your editor by downloading our <a href="https://static.runkitcdn.com/assets/typedefs/RunKit.d.ts">RunKit.d.ts</a> type declaration file. VS Code will automatically detect the declaration file if it's in your project, so you'll have IntelliSense working even if you are using Vanilla JavaScript.</p></section><hr/><section id="examples" class="_1af0wdq"><div><h2>Examples</h2></div><p>We've covered some simple examples in <a href="#common-use-cases">Common use cases</a>. Here we'll walk through a couple more intricate examples.</p><h3>1. Change the style of the gutter</h3><p>This examples demonstrates styling the gutter. Valid options for gutter are "inside", "outside", or "none".</p><div style="margin-bottom:40px"><div style="height:inherit;max-width:710px;margin-bottom:20px" class="source-editor"><textarea placeholder=""></textarea><div class="prerender" style="display:block"><div><script src="https://embed.runkit.com"></script> <style>.embed { overflow: visible; }</style> <pre class="embed" data-gutter="inside">console.log("hello inside"); 1 + 1</pre> <pre class="embed" data-gutter="outside">console.log("hello outside"); 1 + 1</pre> <pre class="embed" data-gutter="none">console.log("hello none"); 1 + 1</pre> <script> const elements = [...document.getElementsByClassName('embed')] const notebooks = elements.reduce((notebooks, element) => { const innerText = element.firstChild const currentCell = window.RunKit.createNotebook({ element, gutterStyle: element.getAttribute("data-gutter"), source: innerText.textContent, // Remove the text content of the pre tag after the embed has loaded onLoad: () => innerText.remove() }) return notebooks }, []) </script> </div></div><div class="gutter" style="display:block"></div></div></div><h3>2. Web Components</h3><p>Use RunKit as a custom element. This example defines <code>rk-embed</code> as a new custom element.</p><div style="margin-bottom:40px"><div style="height:inherit;max-width:710px;margin-bottom:20px" class="source-editor"><textarea placeholder=""></textarea><div class="prerender" style="display:block"><div><script src="https://embed.runkit.com"></script> <rk-embed>console.log("hello world")</rk-embed> <script> class RunKitEmbed extends HTMLElement { constructor() { super(); const wrapper = document.createElement('div') wrapper.style = "margin: 20pt" const source = this.textContent this.textContent = "" const tempCodePlaceholder = document.createElement('pre') tempCodePlaceholder.textContent = source window.RunKit.createNotebook({ element: wrapper, source, onLoad: () => tempCodePlaceholder.remove() }) this.appendChild(wrapper) this.appendChild(tempCodePlaceholder) } } customElements.define('rk-embed', RunKitEmbed); </script> </div></div><div class="gutter" style="display:block"></div></div></div></section><section id="bindings" class="_1af0wdq"><div><h2>Bindings</h2></div><ul><li><a href="https://github.com/runkitdev/react-runkit">React Component</a></li><li><a href="https://github.com/runkitdev/ember-runkit">Ember Component</a></li><li><a href="https://github.com/runkitdev/angular-runkit">Angular Component</a></li></ul></section><hr/><section id="oembed" class="_1af0wdq"><div><h2>OEmbed</h2></div><h3>Embed existing notebooks with OEmbed</h3><p>Our OEmbed endpoint is available at: <code>https://embed.runkit.com/oembed</code>. <a href="https://embed.runkit.com/oembed?url=https://runkit.com/runkit/welcome">Example OEmbed link</a></p><p>We support only the JSON format for responses. See the <a href="http://oembed.com/">OEmbed documentation</a> for information about how to implement the protocol. RunKit does support auto-discovery of notebooks.</p><section id="dynamic-height" class="_1af0wdq"><div><h2>Dynamic Height</h2></div><p>RunKit Embeds are highly interactive, and as a result they want to change height in response to user interaction. If you're using RunKit with <a href="http://embed.ly">Embed.ly</a>, using their <a href="http://docs.embed.ly/docs/platformjs">Platform.js</a> library will make sure everything works smoothly. If you're using OEmbed directly, you'll want to include this script, or something similar, on your page to listen to changes in the Embed's height:</p><div class=" cm-read-only"><textarea readonly="" placeholder=""></textarea><div class="prerender" style="display:block"><div><script> window.addEventListener('message', function(e) { if (e.origin !== "https://runkit.com") return; try { var data = JSON.parse(e.data); } catch (e) { return false; } if (data.context !== 'iframe.resize') { return false; } var iframe = document.querySelector('iframe[src="' + data.src + '"]'); if (!iframe) { return false; } if (data.height) { iframe.height = data.height; } }); </script> </div></div><div class="gutter" style="display:block"></div></div><p>This code is not RunKit specific, and it's how many sites implement this behavior. It's a simple protocol for an iframe to message its parent requesting the height of the frame be changed.</p></section></section><section id="showcase" class="_1af0wdq"><div><h2>Showcase</h2></div><p>RunKit Embeds are used on many websites for <a href="https://immutable-js.github.io/immutable-js/docs/#/Map">documentation</a>, to provide examples in a <a href="https://marcopolo.io/code/datafrog-js/">blog post</a>, or to let visitors <a href="https://www.stellar.org">run a code snippet</a>. Check out these sites using RunKit embeds to enhance their pages:</p><div class="examples row"><div class="col-12 col-sm-4"><a href="http://expressjs.com/en/starter/hello-world.html" class="_1d2af4v" style="background:#eee"><img src="https://static.runkitcdn.com/assets/images/integrations/express.svg"/><div class="_194a634"><span class="title">Express</span></div></a></div><div class="col-12 col-sm-4"><a href="https://lodash.com/docs" class="_1d2af4v" style="background:#fff"><img src="https://static.runkitcdn.com/assets/images/integrations/lodash.svg"/><div class="_194a634"><span class="title">Lodash</span></div></a></div><div class="col-12 col-sm-4"><a href="http://ramdajs.com/docs/" class="_1d2af4v" style="background:#849"><img src="https://static.runkitcdn.com/assets/images/integrations/ramda.svg"/><div class="_194a634"><span class="title">Ramda</span></div></a></div></div></section></main></div></div><div></div></div><footer><div><a href="https://twitter.com/runkitdev"><img src="https://static.runkitcdn.com/assets/images/integrations/twitter.svg" title="twitter" height="16"/></a></div><div id="copy">© <!-- -->2024<!-- --> runkit • <!-- --> <a href="/s/privacy">privacy</a> · <!-- --> <a href="/s/terms">terms</a> · <!-- --> <a href="/about">about</a> · <a href="/jobs">jobs</a> <!-- -->· <a href="http://blog.runkit.com">blog</a> · <!-- --> <a href="https://discuss.runkit.com">forum</a></div></footer></div></div></div></div><script type = "javascript/uri-encoded-json" id = "asset-checksums">%7B%22%2Fassets%2Fdocs.bundle.js%22%3A%7B%22integrity%22%3A%22sha512-KzFBzfCEH2QbrSsyyetBQ9qxDTG78yrNjn7QzwiemB8k0apUvZi0xzblvV3ZNNrOEV6zfwyldkaFkr3WNrqhWQ%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fdocs-sha512-KzFBzfCEH2QbrSsyyetBQ9qxDTG78yrNjn7QzwiemB8k0apUvZi0xzblvV3ZNNrOEV6zfwyldkaFkr3WNrqhWQ%3D%3D.bundle.js%22%7D%2C%22%2Fassets-runkit-packages-static-executables%2Fupdate-from-url.bundle.js%22%3A%7B%22integrity%22%3A%22sha512-F0P%2FugFZRRhhiow%2BGu5TSY7zBkXhfyeCCb1vmXAg4N2GoFypqRBBPdhqrSRMxcd3v5Gd0JlTdmrGdkS4%2B%2BfwGw%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets-runkit-packages-static-executables%2Fupdate-from-url-sha512-F0P_ugFZRRhhiow%2BGu5TSY7zBkXhfyeCCb1vmXAg4N2GoFypqRBBPdhqrSRMxcd3v5Gd0JlTdmrGdkS4%2B%2BfwGw%3D%3D.bundle.js%22%7D%2C%22%2Funpublished-assets%2Frunkit-embed.bundle.js%22%3A%7B%22integrity%22%3A%22sha512-dFft1HTjn85tkKJ8XaUtICOLKZvi%2F0cVCH%2FOlHDkR%2BbdgqYdpU84wNJfbq650K1JM%2BmFKD5JRi%2FT2emrCeG8yw%3D%3D%22%2C%22newURL%22%3A%22..%2Funpublished-assets%2Frunkit-embed.bundle.js%22%7D%2C%22%2Fassets%2Froutes.bundle.js%22%3A%7B%22integrity%22%3A%22sha512-TZhdND1K7qXpiZjsfhdQODNjV3rjSBBqHmGpj707%2Fz8Kbb9ORcFbzBKXdVmrj4TCLnTF6Hd77hcGz8Pe9PxTUA%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Froutes-sha512-TZhdND1K7qXpiZjsfhdQODNjV3rjSBBqHmGpj707_z8Kbb9ORcFbzBKXdVmrj4TCLnTF6Hd77hcGz8Pe9PxTUA%3D%3D.bundle.js%22%7D%2C%22%2Fassets%2Foembed-loader.bundle.js%22%3A%7B%22integrity%22%3A%22sha512-V4rcOoNrrbAI8nOG0mWTwOqijyZ%2FXBTkYLU7fp1yJ41LlbnQ3iHhVHqdVKOmbsbmu6sA3zAMvQNlu%2FhI5kW5Wg%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Foembed-loader-sha512-V4rcOoNrrbAI8nOG0mWTwOqijyZ_XBTkYLU7fp1yJ41LlbnQ3iHhVHqdVKOmbsbmu6sA3zAMvQNlu_hI5kW5Wg%3D%3D.bundle.js%22%7D%2C%22%2Fassets%2Fsandboxed-map-viewer.bundle.js%22%3A%7B%22integrity%22%3A%22sha512-jLp2LWkaBFGlnr8EU2iDdrO7WNiePNl9H5PHEKWukwB9fl0ebvsIEItl6t7d8VLlfSvSBvz4LYPL6cKotAlN%2BA%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fsandboxed-map-viewer-sha512-jLp2LWkaBFGlnr8EU2iDdrO7WNiePNl9H5PHEKWukwB9fl0ebvsIEItl6t7d8VLlfSvSBvz4LYPL6cKotAlN%2BA%3D%3D.bundle.js%22%7D%2C%22%2Fassets%2Fiframe-script.bundle.js%22%3A%7B%22integrity%22%3A%22sha512-vn22mcTyPC%2F%2FB9lWuPMXNRmTuYdZnx%2BFPXFJb%2Bayl9emKnPH2FIriGCwrfvr1ODXeeAUADNp%2BkM%2B12AJdSUeDQ%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fiframe-script-sha512-vn22mcTyPC__B9lWuPMXNRmTuYdZnx%2BFPXFJb%2Bayl9emKnPH2FIriGCwrfvr1ODXeeAUADNp%2BkM%2B12AJdSUeDQ%3D%3D.bundle.js%22%7D%2C%22%2Fassets%2Fadmin.bundle.js%22%3A%7B%22integrity%22%3A%22sha512-eyGC9jqLZxUwxe4UhAqVP%2FAg%2BkxS92PqPmJUWy3LLogiCcQeuuk689x0l4kxxp%2BUofDevuXwOJ5ou7DDP%2B60Ow%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fadmin-sha512-eyGC9jqLZxUwxe4UhAqVP_Ag%2BkxS92PqPmJUWy3LLogiCcQeuuk689x0l4kxxp%2BUofDevuXwOJ5ou7DDP%2B60Ow%3D%3D.bundle.js%22%7D%2C%22%2Fassets%2Fwindow-manager.bundle.js%22%3A%7B%22integrity%22%3A%22sha512-9GmSPvShM9HaTVdDNwLmSEwRMmxhJnCiJ2vagGG3HyCuKnKH0KF1dE4CDMBCh5dg2p04ypiSdXEkTGfSlU3RkQ%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fwindow-manager-sha512-9GmSPvShM9HaTVdDNwLmSEwRMmxhJnCiJ2vagGG3HyCuKnKH0KF1dE4CDMBCh5dg2p04ypiSdXEkTGfSlU3RkQ%3D%3D.bundle.js%22%7D%2C%22%2Fassets%2Fmain.bundle.js%22%3A%7B%22integrity%22%3A%22sha512-QHtgc1wfDaYFw9%2FtNDGdbVginyqgmR4J%2BHfIj%2FquoMx0yPHabZFpjOTaADqKUMMgaBELVB%2FdArMzzt%2FJRbyQHg%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fmain-sha512-QHtgc1wfDaYFw9_tNDGdbVginyqgmR4J%2BHfIj_quoMx0yPHabZFpjOTaADqKUMMgaBELVB_dArMzzt_JRbyQHg%3D%3D.bundle.js%22%7D%2C%22%2Fassets%2Fvalues.bundle.js%22%3A%7B%22integrity%22%3A%22sha512-%2B%2ByhZmSKELXN8bsCj5hAOcLApcUGlQDXPFpwDI4vmxsWfuPxupmg%2FOqlN7hcdVNXREJ1m%2Fy3yxsJVo%2B3VSHFkA%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fvalues-sha512-%2B%2ByhZmSKELXN8bsCj5hAOcLApcUGlQDXPFpwDI4vmxsWfuPxupmg_OqlN7hcdVNXREJ1m_y3yxsJVo%2B3VSHFkA%3D%3D.bundle.js%22%7D%2C%22%2Fassets-runkit-packages-static-executables%2Fdownload.bundle.js%22%3A%7B%22integrity%22%3A%22sha512-YAtnCXkLQwpds5XBGMqEjXmQumJPd4JIIxv1Bfdqe0yb3hiDnpNM%2FN7pHZDKCnuR6s6iqsJGIjd9fwd0kkBG7A%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets-runkit-packages-static-executables%2Fdownload-sha512-YAtnCXkLQwpds5XBGMqEjXmQumJPd4JIIxv1Bfdqe0yb3hiDnpNM_N7pHZDKCnuR6s6iqsJGIjd9fwd0kkBG7A%3D%3D.bundle.js%22%7D%2C%22%2Fassets%2Ftheme-preview.bundle.js%22%3A%7B%22integrity%22%3A%22sha512-STVFiL2BvJQJmyj9oSAdl%2FuHK13jHV5fgN7Ib35vjlGsEmoYq10nUlKJ3xwNqGys9OyAt4F61Ym41of05keDXg%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Ftheme-preview.bundle.js%22%7D%2C%22%2Fassets-runkit-packages-static-executables%2Fupdate-parent.bundle.js%22%3A%7B%22integrity%22%3A%22sha512-IW8D09RhHoOi4m85d15vQKOab6FetQJ4Vn0nAtmQxQnIENcBFYhoHxoNc3Go1OPT8a91%2Fd7LcoDQq1iaV0CsKA%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets-runkit-packages-static-executables%2Fupdate-parent-sha512-IW8D09RhHoOi4m85d15vQKOab6FetQJ4Vn0nAtmQxQnIENcBFYhoHxoNc3Go1OPT8a91_d7LcoDQq1iaV0CsKA%3D%3D.bundle.js%22%7D%2C%22%2Fassets%2Fvalue-viewer-page.bundle.js%22%3A%7B%22integrity%22%3A%22sha512-DDaHDUc%2FFE2h%2BqX1dgVMlrqXU%2F4sjmglbhjtBG3CaTFXfTzUY12%2BUthqEMHIz%2BVvaEVU8S6I27SIMjjOHDqfMw%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fvalue-viewer-page-sha512-DDaHDUc_FE2h%2BqX1dgVMlrqXU_4sjmglbhjtBG3CaTFXfTzUY12%2BUthqEMHIz%2BVvaEVU8S6I27SIMjjOHDqfMw%3D%3D.bundle.js%22%7D%2C%22%2Fassets%2Fchart.bundle.js%22%3A%7B%22integrity%22%3A%22sha512-5cqPi6eNKaqzhXKesFfCwYJzNceburSTyTtd9kjWX%2FgOBJSBN4Q63T4r4KPD05W%2BxKOt3q%2B%2FoWTGTeK1u5dJmQ%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fchart-sha512-5cqPi6eNKaqzhXKesFfCwYJzNceburSTyTtd9kjWX_gOBJSBN4Q63T4r4KPD05W%2BxKOt3q%2B_oWTGTeK1u5dJmQ%3D%3D.bundle.js%22%7D%2C%22%2Fassets%2Fstyles%2Fbase2.css%22%3A%7B%22integrity%22%3A%22sha512-AGG6bMg2p381NKpKf%2F3mnfnsLIJEsL0CGZQR%2FxzGG0ZBTnSMUkXlhOpIezyhdeUFw%2BlZDWuah2ALSeR0JciF5g%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fstyles%2Fbase2-sha512-AGG6bMg2p381NKpKf_3mnfnsLIJEsL0CGZQR_xzGG0ZBTnSMUkXlhOpIezyhdeUFw%2BlZDWuah2ALSeR0JciF5g%3D%3D.css%22%7D%2C%22%2Fassets%2Fvendor%2Fbootstrap%2Fbootstrap.min.css%22%3A%7B%22integrity%22%3A%22sha512-tDXPcamuZsWWd6OsKFyH6nAqh%2FMjZ%2F5Yk88T5o%2BaMfygqNFPan1pLyPFAndRzmOWHKT%2BjSDzWpJv8krj6x1LMA%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fvendor%2Fbootstrap%2Fbootstrap-sha512-tDXPcamuZsWWd6OsKFyH6nAqh_MjZ_5Yk88T5o%2BaMfygqNFPan1pLyPFAndRzmOWHKT%2BjSDzWpJv8krj6x1LMA%3D%3D.min.css%22%7D%2C%22%2Fassets%2Fstyles%2Fadmin.css%22%3A%7B%22integrity%22%3A%22sha512-CJ8qDCejiskTZ8CulKXAAS03kxJweNrz8fb0AyitaDtnG%2BKwLK0KoJGc44y8uT%2Bqiqr20mwXoA8dElsMBREI3g%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fstyles%2Fadmin-sha512-CJ8qDCejiskTZ8CulKXAAS03kxJweNrz8fb0AyitaDtnG%2BKwLK0KoJGc44y8uT%2Bqiqr20mwXoA8dElsMBREI3g%3D%3D.css%22%7D%2C%22%2Fassets-runkit-packages-static%2Funrecognized.css%22%3A%7B%22integrity%22%3A%22sha512-RF4DD4YWXV3Ftqqpxp9MseZNtqsCyXEF4s%2Fs2eNMmIDhqMRbM%2BWQsuQonPNhnU4UjZN15k5iPxOto9RNVMkxWw%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets-runkit-packages-static%2Funrecognized-sha512-RF4DD4YWXV3Ftqqpxp9MseZNtqsCyXEF4s_s2eNMmIDhqMRbM%2BWQsuQonPNhnU4UjZN15k5iPxOto9RNVMkxWw%3D%3D.css%22%7D%2C%22%2Fassets%2Fvendor%2Fc3%2Fc3.min.css%22%3A%7B%22integrity%22%3A%22sha512-%2BdWF4n9qbXA0%2FhbRB1rJYjnAKSkBndxkUTT%2FhrinqiGgnW7f7ZwIqI8BSj8iQrRfCtTlsTN91xt%2FJcU0YZbqQA%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fvendor%2Fc3%2Fc3-sha512-%2BdWF4n9qbXA0_hbRB1rJYjnAKSkBndxkUTT_hrinqiGgnW7f7ZwIqI8BSj8iQrRfCtTlsTN91xt_JcU0YZbqQA%3D%3D.min.css%22%7D%2C%22%2Fassets-runkit-packages-static%2Foverview.css%22%3A%7B%22integrity%22%3A%22sha512-5HBevnJp8L5wna5KF9XtjLz7dkXpILp8jFx8hEo2MgCSKg%2FJZOoiYzGCygjCu4UFb6DfjtH2qMT1l1PKrlrHnQ%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets-runkit-packages-static%2Foverview-sha512-5HBevnJp8L5wna5KF9XtjLz7dkXpILp8jFx8hEo2MgCSKg_JZOoiYzGCygjCu4UFb6DfjtH2qMT1l1PKrlrHnQ%3D%3D.css%22%7D%2C%22%2Fassets%2Fstyles%2Fcodemirror.css%22%3A%7B%22integrity%22%3A%22sha512-7vaQ4LLdaXd2IuMd4MUQ6LRFIGbEwJI1aq6KYqL3RjbdQyUkRFhwZKmqmkBXurTFdGlx687lTN8FSJfX6Df8Gw%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fstyles%2Fcodemirror-sha512-7vaQ4LLdaXd2IuMd4MUQ6LRFIGbEwJI1aq6KYqL3RjbdQyUkRFhwZKmqmkBXurTFdGlx687lTN8FSJfX6Df8Gw%3D%3D.css%22%7D%2C%22%2Fassets%2Fstyles%2Fstatic.css%22%3A%7B%22integrity%22%3A%22sha512-qOEI%2Bil%2F46N%2F1TZNKAZS8IfXZ%2BvPIEcU%2B9VTUwWBbWx1PlgZIwxmA3YB%2FhDYaM4GIRIWAvwftdZxbpqdMBppLg%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fstyles%2Fstatic-sha512-qOEI%2Bil_46N_1TZNKAZS8IfXZ%2BvPIEcU%2B9VTUwWBbWx1PlgZIwxmA3YB_hDYaM4GIRIWAvwftdZxbpqdMBppLg%3D%3D.css%22%7D%2C%22%2Fassets%2Fvendor%2Ffont-awesome%2Fcss%2Ffont-awesome.min.css%22%3A%7B%22integrity%22%3A%22sha512-SfTiTlX6kk%2Bqitfevl%2F7LibUOeJWlt9rbyDn92a1DqWOw9vWG2MFoays0sgObmWazO5BQPiFucnnEAjpAB%2B%2FSw%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fvendor%2Ffont-awesome%2Fcss%2Ffont-awesome-sha512-SfTiTlX6kk%2Bqitfevl_7LibUOeJWlt9rbyDn92a1DqWOw9vWG2MFoays0sgObmWazO5BQPiFucnnEAjpAB%2B_Sw%3D%3D.min.css%22%7D%2C%22%2Fassets%2Fstyles%2Fnpm.css%22%3A%7B%22integrity%22%3A%22sha512-dGXN6LvbwmcY1a71btRiirj5lcyRk%2B6BaKMEt65vRSWBuzC6KkUnxbWqu3iUzr2d9ebkkryKiN1scefAFOcCSQ%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fstyles%2Fnpm-sha512-dGXN6LvbwmcY1a71btRiirj5lcyRk%2B6BaKMEt65vRSWBuzC6KkUnxbWqu3iUzr2d9ebkkryKiN1scefAFOcCSQ%3D%3D.css%22%7D%2C%22%2Fassets-runkit-packages-static%2Ftext.css%22%3A%7B%22integrity%22%3A%22sha512-hMXVzQAm7WMNCxFLorSUo1dfndC%2FejjrhL2K9jnPmmgj%2BuuhgPbFv7FjyklBmCF4WipTv9GxC90scnXU3LZT2A%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets-runkit-packages-static%2Ftext-sha512-hMXVzQAm7WMNCxFLorSUo1dfndC_ejjrhL2K9jnPmmgj%2BuuhgPbFv7FjyklBmCF4WipTv9GxC90scnXU3LZT2A%3D%3D.css%22%7D%2C%22%2Fassets%2Fstyles%2Fwindow-buttons.css%22%3A%7B%22integrity%22%3A%22sha512-L0RXJ4mRmlnfIxu%2FqwR7G83Ne4rQ6PEuCFnjGdOFbONwe2E%2Bi9FHsWgJ0kDhJ5uHf98Q79ipYYYucSUoAxbUgA%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fstyles%2Fwindow-buttons-sha512-L0RXJ4mRmlnfIxu_qwR7G83Ne4rQ6PEuCFnjGdOFbONwe2E%2Bi9FHsWgJ0kDhJ5uHf98Q79ipYYYucSUoAxbUgA%3D%3D.css%22%7D%2C%22%2Fassets%2Fvendor%2Fphoton%2Ficons.min.css%22%3A%7B%22integrity%22%3A%22sha512-4pURzInKvIGq8AfiVX2AFrOL3Amo9X%2FwfnhZFdNLab9NClylJ1Txa39ilHDhlP%2BDI8N%2F%2FqKKC9q3jKEGP1xxBQ%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fvendor%2Fphoton%2Ficons-sha512-4pURzInKvIGq8AfiVX2AFrOL3Amo9X_wfnhZFdNLab9NClylJ1Txa39ilHDhlP%2BDI8N__qKKC9q3jKEGP1xxBQ%3D%3D.min.css%22%7D%2C%22%2Fassets%2Fstyles%2Freadme.css%22%3A%7B%22integrity%22%3A%22sha512-WhtYK%2Bo5241rgIy%2FqYspTo70CNGhazB89qL%2BIxVYKb6u1qbXSgfjS3%2BPpUr9LqmbZdtJRC%2FyvWZdHFe4jQ4pwg%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fstyles%2Freadme-sha512-WhtYK%2Bo5241rgIy_qYspTo70CNGhazB89qL%2BIxVYKb6u1qbXSgfjS3%2BPpUr9LqmbZdtJRC_yvWZdHFe4jQ4pwg%3D%3D.css%22%7D%2C%22%2Fassets-runkit-packages-static%2Fbootstrap-reboot.css%22%3A%7B%22integrity%22%3A%22sha512-JtCUSOdqjetJggepwCCR9FT8g07iSENmKyOFQ%2Fcc5WsATPU6f57wEODAHzoqWy%2B%2FQIALSVDSmf%2F2XcYF83gWFg%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets-runkit-packages-static%2Fbootstrap-reboot-sha512-JtCUSOdqjetJggepwCCR9FT8g07iSENmKyOFQ_cc5WsATPU6f57wEODAHzoqWy%2B_QIALSVDSmf_2XcYF83gWFg%3D%3D.css%22%7D%2C%22%2Fassets%2Fstyles%2Ferror-pages.css%22%3A%7B%22integrity%22%3A%22sha512-wc0YZ4YI9QYzM021UgryZhTff2THiN3aLCk40mEGBgaRokLMSOulNQ%2FWYo54nVHyafnx9xc92BQK4mdFgdv1Rg%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fstyles%2Ferror-pages-sha512-wc0YZ4YI9QYzM021UgryZhTff2THiN3aLCk40mEGBgaRokLMSOulNQ_WYo54nVHyafnx9xc92BQK4mdFgdv1Rg%3D%3D.css%22%7D%2C%22%2Fassets%2Fstyles%2Fbase.css%22%3A%7B%22integrity%22%3A%22sha512-JJhyit1rR09PVXP%2BQrvQFLhZEfqp6%2BNWtO1rnlzKWmb1pD%2FKdq2OZ0dfE69CmGq2HgNzjHNwZ7dLDdc1oIC1hQ%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fstyles%2Fbase-sha512-JJhyit1rR09PVXP%2BQrvQFLhZEfqp6%2BNWtO1rnlzKWmb1pD_Kdq2OZ0dfE69CmGq2HgNzjHNwZ7dLDdc1oIC1hQ%3D%3D.css%22%7D%2C%22%2Fassets-runkit-packages-static%2Fimage.css%22%3A%7B%22integrity%22%3A%22sha512-EV%2FRYpveYeVN5fq2AdLzNs8HSBBtJ9LblWhwj8Eymy2mSZSXGStEGBFSdL9j4a57Q8Mnsj11s32NSu7W1XctTA%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets-runkit-packages-static%2Fimage-sha512-EV_RYpveYeVN5fq2AdLzNs8HSBBtJ9LblWhwj8Eymy2mSZSXGStEGBFSdL9j4a57Q8Mnsj11s32NSu7W1XctTA%3D%3D.css%22%7D%2C%22%2Fassets%2Fvendor%2Fphotonkit%2Fphoton.min.css%22%3A%7B%22integrity%22%3A%22sha512-8qj8n6SsrAaV3baPN5S%2BKDMN7JYIx8BC%2Bej%2BBUMBfbk%2BQkXB7GF3rMhCyhqYjDm8%2B89yV0J5aVDI5%2FPRwVI5jw%3D%3D%22%2C%22newURL%22%3A%22..%2Fassets%2Fvendor%2Fphotonkit%2Fphoton-sha512-8qj8n6SsrAaV3baPN5S%2BKDMN7JYIx8BC%2Bej%2BBUMBfbk%2BQkXB7GF3rMhCyhqYjDm8%2B89yV0J5aVDI5_PRwVI5jw%3D%3D.min.css%22%7D%7D</script><script type = "javascript/uri-encoded-json" id = "serialized-client-env">%7B%22CSRF%22%3A%22499a6d91-06fc-4294-9acc-96499da6216b%22%2C%22VERSION%22%3A%22ce0f1cbf00545d68f7a212bb4a3cb3a4aac49d35%22%2C%22SENTRY_PUBLIC_DSN%22%3A%22https%3A%2F%2Ffc5fbd4eddce4289afde53ed4fc1dabe%40sentry.io%2F47331%22%2C%22RENDERED_HTML_HOST%22%3A%22runkit-rendered-html.com%22%2C%22OUTPUT_BUFFER_HOST%22%3A%22runkit-output-buffer.com%22%2C%22IMAGE_PROXY_HOST%22%3A%22runkit-image-proxy.com%22%2C%22NOTEBOOK_DOWNLOAD_HOST%22%3A%22runkit-notebook-download.com%22%2C%22DOCS_HOST%22%3A%22docs.runkitcdn.com%22%2C%22BADGE_HOST%22%3A%22badge.runkitcdn.com%22%2C%22THEMES_HOST%22%3A%22themes.runkitcdn.com%22%2C%22APP_HOST%22%3A%22runkit.com%22%2C%22EMBED_HOST%22%3A%22embed.runkit.com%22%2C%22NPM_HOST%22%3A%22npm.runkit.com%22%2C%22STATIC_HOST%22%3A%22static.runkitcdn.com%22%2C%22RUNKIT_PACKAGES_HOST%22%3A%22runkit-packages.com%22%2C%22RUNKIT_PACKAGES_DOWNLOAD_HOST%22%3A%22runkit-packages-download.com%22%2C%22RUNKIT_PACKAGES_STATIC_HOST%22%3A%22runkit-packages-static.com%22%2C%22RUNKIT_PACKAGES_STATIC_EXECUTABLES_HOST%22%3A%22runkit-packages-static-executables.com%22%2C%22API_HOST%22%3A%22runkit.sh%22%2C%22LEGACY_API_HOST%22%3A%22runkit.io%22%2C%22WELCOME_DOC_URL%22%3A%22%2Frunkit%2Fwelcome%2F7.0.0%2Fclone%3Fresults%3Dfalse%22%2C%22GA_TRACKING_RUNKIT_EMBEDS%22%3A%22UA-65519033-3%22%2C%22GOOGLE_ANALYTICS_ID%22%3A%22UA-65519033-1%22%2C%22MAPBOX_PUBLIC_KEY%22%3A%22pk.eyJ1IjoidG9sbWFza3kiLCJhIjoiY2o0Yms3MmRyMDFhZDJxcHMwaWN0ZzFjZCJ9.ChGWCB7PLE-FaWVeksrjdQ%22%7D</script><script type = "javascript/uri-encoded-json" id = "react-properties">%7B%22index%22%3A5%2C%22objects%22%3A%5Bfalse%2C%22embedCode%22%2C%22%2Fuser%22%2C%22state%22%2C%22value%22%2C%5B1%2C7%2C6%2C9%2C8%5D%2C%5B1%2C11%2C10%2C12%2C-2%2C14%2C13%2C3%2C15%2C17%2C16%2C18%2C0%2C19%2C-2%5D%2C%22props%22%2C%5B1%2C2%2C20%5D%2C%22resourceCache%22%2C0%2C%22exampleId%22%2C%22accessKey%22%2C%22https%3A%2F%2Frunkit.com%2Fdocs%2Fembed%22%2C%22URL%22%2C%5B0%2C21%2C22%5D%2C%22499a6d91-06fc-4294-9acc-96499da6216b%22%2C%22csrf%22%2C%22admin%22%2C%22isStaff%22%2C%5B1%2C23%2C2%2C4%2C-1%5D%2C%22user%22%2C%5B0%2C24%2C25%5D%2C%22href%22%2C%22current-results%22%2C%5B0%2C26%2C27%2C3%2C28%5D%2C%22values%22%2C%5B0%2C29%2C30%5D%2C%5B0%2C31%2C0%2C32%2C33%5D%2C%22only%22%2C%5B0%2C34%2C2%2C35%2C0%2C36%2C37%5D%2C%22dropdown-expanded%22%2C%22router%22%2C%5B0%2C38%2C39%5D%2C%22%24href%22%2C%22once%22%2C%22loaded%22%2C%5B0%2C40%2C41%2C4%2C-1%5D%2C%22selected%22%2C%5B0%2C42%2C43%2C44%2C45%2C46%2C47%2C48%2C49%2C50%2C51%2C52%2C0%2C53%2C54%2C55%2C56%2C57%2C58%2C59%2C60%5D%2C%22__noInspect%22%2Ctrue%2C%22theme%22%2C%22runkit-light%22%2C%22nodeVersion%22%2C%2218.x.x%22%2C%22gutterStyle%22%2C%22outside%22%2C%22programmatic%22%2C%5B0%2C1%2C61%5D%2C%22complexExample1%22%2C%5B0%2C1%2C62%5D%2C%22endpointMode%22%2C%22minHeight%22%2C73%2C%22complexExample4%22%2C%5B0%2C1%2C63%5D%2C%22source%22%2C%22%2F%2F%20GeoJSON!%5Cnvar%20getJSON%20%3D%20require(%5C%22async-get-json%5C%22)%3B%5Cn%5Cnawait%20getJSON(%5C%22https%3A%2F%2Fstorage.googleapis.com%2Fmaps-devrel%2Fgoogle.json%5C%22)%3B%22%2C%22dataAttr%22%2C%5B0%2C1%2C64%5D%2C%22%3Ch3%20style%3D%5C%22text-align%3A%20center%3B%5C%22%3EWelcome%20to%20my%20website%3C%2Fh3%3E%5Cn%5Cn%3Cscript%20src%3D%5C%22https%3A%2F%2Fembed.runkit.com%5C%22%3E%3C%2Fscript%3E%5Cn%3Cdiv%20id%3D%5C%22my-element%5C%22%3E%3C%2Fdiv%3E%5Cn%3Cscript%3Evar%20notebook%20%3D%20RunKit.createNotebook(%7B%5Cn%20%20%20%20%2F%2F%20the%20parent%20element%20for%20the%20new%20notebook%5Cn%20%20%20%20element%3A%20document.getElementById(%5C%22my-element%5C%22)%2C%5Cn%20%20%20%20%2F%2F%20specify%20the%20source%20of%20the%20notebook%5Cn%20%20%20%20source%3A%20%5C%22%2F%2F%20GeoJSON!%5C%5Cnvar%20getJSON%20%3D%20require(%5C%5C%5C%22async-get-json%5C%5C%5C%22)%3B%5C%5Cn%5C%5Cnawait%20getJSON(%5C%5C%5C%22https%3A%2F%2Fstorage.googleapis.com%2Fmaps-devrel%2Fgoogle.json%5C%5C%5C%22)%3B%5C%22%5Cn%7D)%3C%2Fscript%3E%22%2C%22%3Cscript%20src%3D%5C%22https%3A%2F%2Fembed.runkit.com%5C%22%3E%3C%2Fscript%3E%5Cn%3Cstyle%3E.embed%20%7B%20overflow%3A%20visible%3B%20%7D%3C%2Fstyle%3E%5Cn%3Cpre%20class%3D%5C%22embed%5C%22%20data-gutter%3D%5C%22inside%5C%22%3Econsole.log(%5C%22hello%20inside%5C%22)%3B%5Cn1%20%2B%201%3C%2Fpre%3E%5Cn%3Cpre%20class%3D%5C%22embed%5C%22%20data-gutter%3D%5C%22outside%5C%22%3Econsole.log(%5C%22hello%20outside%5C%22)%3B%5Cn1%20%2B%201%3C%2Fpre%3E%5Cn%3Cpre%20class%3D%5C%22embed%5C%22%20data-gutter%3D%5C%22none%5C%22%3Econsole.log(%5C%22hello%20none%5C%22)%3B%5Cn1%20%2B%201%3C%2Fpre%3E%5Cn%3Cscript%3E%5Cnconst%20elements%20%3D%20%5B...document.getElementsByClassName('embed')%5D%5Cnconst%20notebooks%20%3D%20elements.reduce((notebooks%2C%20element)%20%3D%3E%20%7B%5Cn%20%20%20%20const%20innerText%20%3D%20element.firstChild%5Cn%20%20%20%20const%20currentCell%20%3D%20window.RunKit.createNotebook(%7B%5Cn%20%20%20%20%20%20%20%20element%2C%5Cn%20%20%20%20%20%20%20%20gutterStyle%3A%20element.getAttribute(%5C%22data-gutter%5C%22)%2C%5Cn%20%20%20%20%20%20%20%20source%3A%20innerText.textContent%2C%5Cn%20%20%20%20%20%20%20%20%2F%2F%20Remove%20the%20text%20content%20of%20the%20pre%20tag%20after%20the%20embed%20has%20loaded%5Cn%20%20%20%20%20%20%20%20onLoad%3A%20()%20%3D%3E%20innerText.remove()%5Cn%20%20%20%20%7D)%5Cn%20%20return%20notebooks%5Cn%7D%2C%20%5B%5D)%5Cn%3C%2Fscript%3E%22%2C%22%3Cscript%20src%3D%5C%22https%3A%2F%2Fembed.runkit.com%5C%22%3E%3C%2Fscript%3E%5Cn%3Crk-embed%3Econsole.log(%5C%22hello%20world%5C%22)%3C%2Frk-embed%3E%5Cn%3Cscript%3E%5Cnclass%20RunKitEmbed%20extends%20HTMLElement%20%7B%5Cn%20%20%20%20constructor()%20%7B%5Cn%20%20%20%20%20%20%20%20super()%3B%5Cn%20%20%20%20%20%20%20%20const%20wrapper%20%3D%20document.createElement('div')%5Cn%20%20%20%20%20%20%20%20wrapper.style%20%3D%20%5C%22margin%3A%2020pt%5C%22%5Cn%5Cn%20%20%20%20%20%20%20%20const%20source%20%3D%20this.textContent%5Cn%20%20%20%20%20%20%20%20this.textContent%20%3D%20%5C%22%5C%22%5Cn%20%20%20%20%20%20%20%20const%20tempCodePlaceholder%20%3D%20document.createElement('pre')%5Cn%20%20%20%20%20%20%20%20tempCodePlaceholder.textContent%20%3D%20source%5Cn%5Cn%20%20%20%20%20%20%20%20window.RunKit.createNotebook(%7B%5Cn%20%20%20%20%20%20%20%20%20%20%20%20element%3A%20wrapper%2C%5Cn%20%20%20%20%20%20%20%20%20%20%20%20source%2C%5Cn%20%20%20%20%20%20%20%20%20%20%20%20onLoad%3A%20()%20%3D%3E%20tempCodePlaceholder.remove()%5Cn%20%20%20%20%20%20%20%20%7D)%5Cn%20%20%20%20%20%20%20%20this.appendChild(wrapper)%5Cn%20%20%20%20%20%20%20%20this.appendChild(tempCodePlaceholder)%5Cn%20%20%20%20%7D%5Cn%7D%5CncustomElements.define('rk-embed'%2C%20RunKitEmbed)%3B%5Cn%3C%2Fscript%3E%22%2C%22%3Ch3%20style%3D%5C%22text-align%3A%20center%3B%5C%22%3EWelcome%20to%20my%20website%3C%2Fh3%3E%5Cn%5Cn%3Cscript%20src%3D%5C%22https%3A%2F%2Fembed.runkit.com%5C%22%20data-element-id%3D%5C%22my-element%5C%22%3E%3C%2Fscript%3E%5Cn%5Cn%3C!--%20anywhere%20else%20on%20your%20page%20--%3E%5Cn%3Cdiv%20id%3D%5C%22my-element%5C%22%3E%2F%2F%20GeoJSON!%5Cnvar%20getJSON%20%3D%20require(%5C%22async-get-json%5C%22)%3B%5Cn%5Cnawait%20getJSON(%5C%22https%3A%2F%2Fstorage.googleapis.com%2Fmaps-devrel%2Fgoogle.json%5C%22)%3B%3C%2Fdiv%3E%22%5D%2C%22typeMap%22%3A%7B%220%22%3A7%2C%221%22%3A0%7D%7D</script><script type = "javascript/json" id = "rendered-class-names">["_1x986e2","_10lnp7s","_1d2af4v","_194a634","_a0d0yi","_1af0wdq"]</script><div data-ignore-width="true" style="clear:both;height:0;margin:0;padding:0"></div><script></script><script type="text/javascript" src="https://static.runkitcdn.com/assets/docs-sha512-KzFBzfCEH2QbrSsyyetBQ9qxDTG78yrNjn7QzwiemB8k0apUvZi0xzblvV3ZNNrOEV6zfwyldkaFkr3WNrqhWQ==.bundle.js" integrity="sha512-KzFBzfCEH2QbrSsyyetBQ9qxDTG78yrNjn7QzwiemB8k0apUvZi0xzblvV3ZNNrOEV6zfwyldkaFkr3WNrqhWQ==" crossorigin="anonymous"></script></body></html>