push intro content, check build

Makefile

@@ -0,0 +1,15 @@
+
+.PHONY: quality style test test-examples
+
+# Check that source code meets quality standards
+
+quality:
+	python -m black --check --line-length 119 --target-version py38 .
+	python -m isort --check-only .
+	python -m flake8 --max-line-length 119
+
+# Format source code automatically
+
+style:
+	python -m black --line-length 119 --target-version py38 .
+	python -m isort .

README.md

@@ -1,37 +1,19 @@
 ---
-title: How To Join
-emoji: ⚡
-colorFrom: green
-colorTo: purple
+title: Dashboard
+emoji: 🌐
+colorFrom: blue
+colorTo: red
 sdk: streamlit
 app_file: app.py
 pinned: false
 ---
 
-# Configuration
+# Training transformers together dashboard
 
-`title`: _string_  
-Display title for the Space
+[![Generic badge](https://img.shields.io/badge/🤗-Open%20In%20Spaces-blue.svg)](https://huggingface.co/spaces/training-transformers-together/training-transformers-together-dashboard)
 
-`emoji`: _string_  
-Space emoji (emoji-only character allowed)
+A dashboard app for Hugging Face Spaces
 
-`colorFrom`: _string_  
-Color for Thumbnail gradient (red, yellow, green, blue, indigo, purple, pink, gray)
-
-`colorTo`: _string_  
-Color for Thumbnail gradient (red, yellow, green, blue, indigo, purple, pink, gray)
-
-`sdk`: _string_  
-Can be either `gradio` or `streamlit`
-
-`sdk_version` : _string_  
-Only applicable for `streamlit` SDK.  
-See [doc](https://hf.co/docs/hub/spaces) for more info on supported versions.
-
-`app_file`: _string_  
-Path to your main application file (which contains either `gradio` or `streamlit` Python code).  
-Path is relative to the root of the repository.
+---
 
-`pinned`: _boolean_  
-Whether the Space stays on top of your list.
+Autogenerated using [this template](https://github.com/nateraw/spaces-template)

app.py

@@ -1,3 +1,107 @@
+import os
+
+import streamlit as st
+import wandb
+
+from dashboard_utils.bubbles import get_new_bubble_data
+from dashboard_utils.main_metrics import get_main_metrics
+from streamlit_observable import observable
+
 import streamlit as st
+import streamlit.components.v1 as components
+
+
+st.set_page_config(page_title="Training Transformers Together", layout="centered")
+with open("static/header.html", 'r', encoding='utf-8') as f:
+    header_html = f.read()
+with open("static/header_style.css", 'r', encoding='utf-8') as f:
+    header_style_css = f.read()
+with open("static/header_animate.js") as f:
+    header_animate_js = f.read()
+with open("static/content_style.css", 'r', encoding='utf-8') as f:
+    content_style_css = f.read()
+with open("static/meta.html", 'r', encoding='utf-8') as f:
+    meta_html = f.read()
+
+st.markdown("## Full demo content will be posted here on December 7th!")
+
+components.html(f"<style>{header_style_css}</style>{header_html}<script>{header_animate_js}</script>", height=260)
+
+st.markdown(meta_html, unsafe_allow_html=True)
+st.markdown(f"<style>{content_style_css}</style>", unsafe_allow_html=True)  # apply css to the rest of the document
+
+def content_text(text: str, vspace: int = 0):
+    st.markdown(f'<center><div class="padded faded main_text" style="padding-top: {vspace}px;">{text}</div><center>',
+                unsafe_allow_html=True)
+CITATIONS = {}
+def cite(tag):
+    CITATIONS[tag] = len(CITATIONS) + 1
+    return f"[{CITATIONS[tag]}]"
+
+content_text(f"""
+There was a time when you could comfortably train SoTA vision and language models at home on your workstation.
+The first ConvNet to beat ImageNet took in 5-6 days on two gamer-grade GPUs {cite("alexnet")}. Today's top-1 imagenet model 
+took 20,000 TPU-v3 days {cite("coatnet")}. And things are even worse in the NLP world: training GPT-3 on a top-tier server
+ with 8 A100 would still take decades {cite("gpt-3")} .""")
+
+content_text(f"""
+So, can individual researchers and small labs still train state-of-the-art? Yes we can!
+All it takes is for a bunch of us to come together. In fact, we're doing it right now and <b>you're invited to join!</b>
+
+""", vspace=12)
+
+
+source = get_main_metrics()
+st.vega_lite_chart(
+    source, {
+        "height": 200,
+        "title": "Training DALLE with volunteers. Updated every few minutes during NeurIPS.",
+        "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
+        "description": "Current training progress",
+        "encoding": {"x": {"field": "date", "type": "temporal"}},
+        "config": {"axisX": {"labelAngle": -40}},
+        "resolve": {"scale": {"y": "independent"}},
+        "layer": [
+            {
+                "mark": {"type": "line", "point": {"tooltip": True, "filled": False, "strokeOpacity": 0},
+                         "color": "#85A9C5"},
+                "encoding": {"y": {"field": "training loss", "type": "quantitative", "axis": {"titleColor": "#85A9C5"}}},
+            },
+            {
+                "mark": {"type": "line", "point": {"tooltip": True, "filled": False, "strokeOpacity": 0.0},
+                         "color": "#85C5A6", "opacity": 0.5},
+                "encoding": {
+                    "y": {"field": "active participants", "type": "quantitative", "axis": {"titleColor": "#85C5A6"}}},
+            },
+        ],
+    },
+    use_container_width=True,
+)
 
-st.title("Coming soon!")
+#
+# st.caption("Number of alive runs over time")
+# st.vega_lite_chart(
+#     source,
+#     use_container_width=True,
+# )
+# st.caption("Number of steps")
+# st.vega_lite_chart(
+#     source,
+#     {
+#         "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
+#         "description": "Training Loss",
+#         "mark": {"type": "line", "point": {"tooltip": True, "filled": False, "strokeOpacity": 0}},
+#         "encoding": {"x": {"field": "date", "type": "temporal"}, "y": {"field": "steps", "type": "quantitative"}},
+#         "config": {"axisX": {"labelAngle": -40}},
+#     },
+#     use_container_width=True,
+# )
+#
+# st.header("Collaborative training participants")
+# serialized_data, profiles = get_new_bubble_data()
+# observable(
+#     "Participants",
+#     notebook="d/9ae236a507f54046",  # "@huggingface/participants-bubbles-chart",
+#     targets=["c_noaws"],
+#     redefine={"serializedData": serialized_data, "profileSimple": profiles},
+# )

dashboard_utils/bubbles.py

@@ -0,0 +1,140 @@
+import datetime
+from concurrent.futures import as_completed
+from urllib import parse
+
+import streamlit as st
+import wandb
+from requests_futures.sessions import FuturesSession
+
+from dashboard_utils.time_tracker import _log, simple_time_tracker
+
+URL_QUICKSEARCH = "https://huggingface.co/api/quicksearch?"
+WANDB_REPO = "learning-at-home/Worker_logs"
+CACHE_TTL = 100
+
+
+@st.cache(ttl=CACHE_TTL)
+@simple_time_tracker(_log)
+def get_new_bubble_data():
+    serialized_data_points, latest_timestamp = get_serialized_data_points()
+    serialized_data = get_serialized_data(serialized_data_points, latest_timestamp)
+
+    usernames = []
+    for item in serialized_data["points"][0]:
+        usernames.append(item["profileId"])
+
+    profiles = get_profiles(usernames)
+
+    return serialized_data, profiles
+
+
+@st.cache(ttl=CACHE_TTL)
+@simple_time_tracker(_log)
+def get_profiles(usernames):
+    profiles = []
+    with FuturesSession() as session:
+        futures = []
+        for username in usernames:
+            future = session.get(URL_QUICKSEARCH + parse.urlencode({"type": "user", "q": username}))
+            future.username = username
+            futures.append(future)
+        for future in as_completed(futures):
+            resp = future.result()
+            username = future.username
+            response = resp.json()
+            avatarUrl = None
+            if response["users"]:
+                for user_candidate in response["users"]:
+                    if user_candidate["user"] == username:
+                        avatarUrl = response["users"][0]["avatarUrl"]
+                        break
+            if not avatarUrl:
+                avatarUrl = "/avatars/57584cb934354663ac65baa04e6829bf.svg"
+
+            if avatarUrl.startswith("/avatars/"):
+                avatarUrl = f"https://huggingface.co{avatarUrl}"
+
+            profiles.append(
+                {"id": username, "name": username, "src": avatarUrl, "url": f"https://huggingface.co/{username}"}
+            )
+    return profiles
+
+
+@st.cache(ttl=CACHE_TTL)
+@simple_time_tracker(_log)
+def get_serialized_data_points():
+
+    api = wandb.Api()
+    runs = api.runs(WANDB_REPO)
+
+    serialized_data_points = {}
+    latest_timestamp = None
+    for run in runs:
+        run_summary = run.summary._json_dict
+        run_name = run.name
+
+        if run_name in serialized_data_points:
+            if "_timestamp" in run_summary and "_step" in run_summary:
+                timestamp = run_summary["_timestamp"]
+                serialized_data_points[run_name]["Runs"].append(
+                    {
+                        "batches": run_summary["_step"],
+                        "runtime": run_summary["_runtime"],
+                        "loss": run_summary["train/loss"],
+                        "velocity": run_summary["_step"] / run_summary["_runtime"],
+                        "date": datetime.datetime.utcfromtimestamp(timestamp),
+                    }
+                )
+                if not latest_timestamp or timestamp > latest_timestamp:
+                    latest_timestamp = timestamp
+        else:
+            if "_timestamp" in run_summary and "_step" in run_summary:
+                timestamp = run_summary["_timestamp"]
+                serialized_data_points[run_name] = {
+                    "profileId": run_name,
+                    "Runs": [
+                        {
+                            "batches": run_summary["_step"],
+                            "runtime": run_summary["_runtime"],
+                            "loss": run_summary["train/loss"],
+                            "velocity": run_summary["_step"] / run_summary["_runtime"],
+                            "date": datetime.datetime.utcfromtimestamp(timestamp),
+                        }
+                    ],
+                }
+                if not latest_timestamp or timestamp > latest_timestamp:
+                    latest_timestamp = timestamp
+    latest_timestamp = datetime.datetime.utcfromtimestamp(latest_timestamp)
+    return serialized_data_points, latest_timestamp
+
+
+@st.cache(ttl=CACHE_TTL)
+@simple_time_tracker(_log)
+def get_serialized_data(serialized_data_points, latest_timestamp):
+    serialized_data_points_v2 = []
+    max_velocity = 1
+    for run_name, serialized_data_point in serialized_data_points.items():
+        activeRuns = []
+        loss = 0
+        runtime = 0
+        batches = 0
+        velocity = 0
+        for run in serialized_data_point["Runs"]:
+            if run["date"] == latest_timestamp:
+                run["date"] = run["date"].isoformat()
+                activeRuns.append(run)
+                loss += run["loss"]
+                velocity += run["velocity"]
+            loss = loss / len(activeRuns) if activeRuns else 0
+            runtime += run["runtime"]
+            batches += run["batches"]
+        new_item = {
+            "date": latest_timestamp.isoformat(),
+            "profileId": run_name,
+            "batches": batches,
+            "runtime": runtime,
+            "activeRuns": activeRuns,
+        }
+        serialized_data_points_v2.append(new_item)
+    serialized_data = {"points": [serialized_data_points_v2], "maxVelocity": max_velocity}
+    return serialized_data

dashboard_utils/main_metrics.py

@@ -0,0 +1,33 @@
+import datetime
+
+import streamlit as st
+import pandas as pd
+
+import wandb
+
+from dashboard_utils.time_tracker import _log, simple_time_tracker
+
+WANDB_REPO = "learning-at-home/Main_metrics"
+CACHE_TTL = 120  # note: in the text, we claim that this plot is updated every few minutes
+
+
+@st.cache(ttl=CACHE_TTL)
+@simple_time_tracker(_log)
+def get_main_metrics():
+    wandb.login(anonymous="must")
+    api = wandb.Api()
+    runs = api.runs(WANDB_REPO)
+    run = runs[0]
+    history = run.scan_history(keys=["step", "loss", "alive peers", "_timestamp"])
+
+    steps = []
+    losses = []
+    alive_peers = []
+    dates = []
+    for row in history:
+        steps.append(row["step"])
+        losses.append(row["loss"])
+        alive_peers.append(row["alive peers"])
+        dates.append(datetime.datetime.utcfromtimestamp(row["_timestamp"]))
+
+    return pd.DataFrame({"steps": steps, "training loss": losses, "active participants": alive_peers, "date": dates})

dashboard_utils/time_tracker.py

@@ -0,0 +1,32 @@
+from functools import wraps
+from time import time
+
+
+def simple_time_tracker(log_fun):
+    def _simple_time_tracker(fn):
+        @wraps(fn)
+        def wrapped_fn(*args, **kwargs):
+            start_time = time()
+
+            try:
+                result = fn(*args, **kwargs)
+            finally:
+                elapsed_time = time() - start_time
+
+                # log the result
+                log_fun(
+                    {
+                        "function_name": fn.__name__,
+                        "total_time": elapsed_time,
+                    }
+                )
+
+            return result
+
+        return wrapped_fn
+
+    return _simple_time_tracker
+
+
+def _log(message):
+    print("[SimpleTimeTracker] {function_name} {total_time:.3f}".format(**message))

perso/change_data.py

@@ -0,0 +1,19 @@
+import json
+import random
+
+with open(
+    "/mnt/storage/Documents/hugging_face/colaborative_hub_training/demo_neurips/training-transformers-together-dashboard/data/"
+    "serializaledata.json",
+    "r",
+) as f:
+    serialized_data = json.load(f)
+
+serialized_data_v2 = serialized_data
+serialized_data_v2["points"] = [[item for item in serialized_data["points"][-1] if random.random() > 0.8]]
+
+with open(
+    "/mnt/storage/Documents/hugging_face/colaborative_hub_training/demo_neurips/training-transformers-together-dashboard/data/"
+    "serializaledata_V2.json",
+    "w",
+) as f:
+    f.write(json.dumps(serialized_data_v2))

perso/get_usernames.py

@@ -0,0 +1,14 @@
+import json
+
+with open(
+    "/mnt/storage/Documents/hugging_face/colaborative_hub_training/demo_neurips/training-transformers-together-dashboard/data/"
+    "serializaledata_V2.json",
+    "r",
+) as f:
+    serialized_data = json.load(f)
+
+usernames = []
+for item in serialized_data["points"][0]:
+    usernames.append(item["profileId"])
+
+print(usernames)

requirements-dev.txt

@@ -0,0 +1,3 @@
+black
+isort
+flake8

requirements.txt

@@ -0,0 +1,3 @@
+streamlit
+wandb
+requests_futures

static/content_style.css

@@ -0,0 +1,70 @@
+.faded {
+  margin: 0 auto;
+  background: var(--window-color);
+  box-shadow: 0 0 5px 5px var(--window-color);
+  font-family: cursive;
+  font-family: "Gill Sans", sans-serif;
+  display: inline-block
+}
+.padded {
+    width: 100%;
+    max-width: 800px;
+    text-align: left;
+}
+.title {
+   font-size: 32px;
+   box-shadow: 0 0 5px 5px var(--window-color);
+   font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,
+                sans-serif,Apple Color Emoji,Segoe UI Emoji;
+}
+.main_text {
+   font-size: 16px;
+   box-shadow: 0 0 5px 5px var(--window-color);
+   font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,
+                sans-serif,Apple Color Emoji,Segoe UI Emoji;
+}
+.arxiv_button {
+  position: relative;
+  display: inline-block;
+  width: 80px;
+  height: 28px;
+  background-image: linear-gradient(180deg, #fafbfc, #eff3f6 90%);
+  color: #24292e;
+  border: 1px solid rgba(27,31,35,.2);
+  text-align: center;
+  cursor: pointer;
+  border-radius: 4px;
+  padding-right: 0px;
+  padding-top: 2.5px;
+  font-size: 12px;
+  font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;
+  font-weight: 600;
+}
+.arxiv_button:before {
+  content: "";
+  vertical-align:middle;
+  display: inline-block;
+  width: 24px;
+  height: 24px;
+  border: none;
+  margin-left: -16px;
+  margin-right: 4px;
+  margin-top: -2px;
+  background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" class="ionicon s-ion-icon" viewBox="0 0 512 512"><path d="M428 224H288a48 48 0 01-48-48V36a4 4 0 00-4-4h-92a64 64 0 00-64 64v320a64 64 0 0064 64h224a64 64 0 0064-64V228a4 4 0 00-4-4z"></path><path d="M419.22 188.59L275.41 44.78a2 2 0 00-3.41 1.41V176a16 16 0 0016 16h129.81a2 2 0 001.41-3.41z"></path></svg>') right center no-repeat;
+  background-size: 18px 16px;
+}
+.arxiv_button:hover {
+    background-color:#e6ebf1;
+    background-position:-0.5em;
+    border-color: #9fa4a9;
+    border-color:rgba(27,31,35,.35);
+    background-image:linear-gradient(180deg, #f0f3f6, #e6ebf1 90%)
+}
+a:link {
+    color: #00194a;
+    text-decoration: none;
+}
+a:visited {
+    color: #3f004a;
+    text-decoration: none;
+}

static/header.html

@@ -0,0 +1,19 @@
+    <div id="container">
+        <canvas></canvas>
+        <div id="overlay">
+            <div id="main_window">
+                <div id="header">
+                    <img src="https://learning-at-home.github.io/logo.png" id="bug-logo"
+                         style="width: 40%; max-height: 320px; max-width: 320px; z-index:1000; position: relative;">
+                    <br>
+                    <h1 class="faded title" style="margin-top:-5%;">
+                        <p style="margin-top: 0px; margin-bottom:0px;">
+                            <span id="title_text">Training Transformers Together</span>
+                        </p>
+                        <p style="font-size: 18px; margin-top:0px; margin-bottom:0px;">
+                            large-scale training for everyone,&nbsp;by&nbsp;everyone</p>
+                    </h1>
+                </div>
+            </div>
+        </div>
+    </div>

static/header_animate.js

@@ -0,0 +1,223 @@
+// draw background; Note: this background is based on https://codepen.io/pawelqcm/pen/oxPYox by Pawel
+// Note 2: Pawel, you're awesome.
+(function() {
+  var content_element = document.getElementById("overlay");
+  var canvas = document.querySelector('canvas');
+  var title_elem = document.getElementsByClassName("faded title")[0];
+  var title_text = document.getElementById("title_text");
+  ctx = canvas.getContext('2d');
+  if (!ctx)
+      console.warn("Your browser does not support canvas, content may be broken :'(");
+
+  var SENSITIVITY, SIBLINGS_LIMIT, DENSITY, TOTAL_NODES, ANCHOR_LENGTH, CURSOR_HEIGHT, CURSOR_WIDTH;
+  css_opts = getComputedStyle(document.documentElement);
+  SENSITIVITY = css_opts.getPropertyValue('--background-sensitivity') || 120;
+  SIBLINGS_LIMIT = css_opts.getPropertyValue('--background-siblings') || 7;
+  NODE_DENSITY = css_opts.getPropertyValue('--background-node-density') || 6;
+  CURSOR_WIDTH = css_opts.getPropertyValue('--background-cursor-width') || 250;
+  CURSOR_HEIGHT = css_opts.getPropertyValue('--background-cursor-height') || 250;
+  CURSOR_VERTICAL_SHRINK = css_opts.getPropertyValue('--background-cursor-vertical-shrink') || 0.1;
+  SPEED_COEF = css_opts.getPropertyValue('--background-speed') || 1;
+  ENERGY_DECAY = css_opts.getPropertyValue('--energy-decay') || 2;
+  SHOW_IF_WIDER_THAN = css_opts.getPropertyValue('--background-show-if-wider-than') || 500;
+  MOVE_ON_CURSOR = css_opts.getPropertyValue('--background-move-on-cursor').includes("true") || false;
+
+  var nodes = [];
+  choice = (choices => choices[Math.floor(Math.random() * choices.length)])
+  sample_color = () => choice([[40, 40, 40], [133, 133, 133]])
+
+  ANCHOR_LENGTH = 20;
+
+  var cursor = {x: 0, y: 0};
+
+  function centralize_cursor() {
+      var rect = document.getElementById("bug-logo").getBoundingClientRect()
+      var window_left = window.pageXOffset || document.documentElement.scrollLeft;
+      var window_top = window.pageYOffset || document.documentElement.scrollTop;
+      cursor.x = window_left + rect.left + rect.width / 2;
+      cursor.y = window_top + rect.top + rect.height / 2;
+  }
+
+  function Node(x, y) {
+    this.anchorX = x;
+    this.anchorY = y;
+    this.x = Math.random() * (x - (x - ANCHOR_LENGTH)) + (x - ANCHOR_LENGTH);
+    this.y = Math.random() * (y - (y - ANCHOR_LENGTH)) + (y - ANCHOR_LENGTH);
+    this.vx = (Math.random() * 2 - 1) * SPEED_COEF;
+    this.vy = (Math.random() * 2 - 1) * SPEED_COEF;
+    this.energy = Math.random() * 100;
+    this.radius = Math.random();
+    this.siblings = [];
+    [this.r, this.g, this.b] = sample_color()
+    this.brightness = 0;
+  }
+
+  Node.prototype.drawNode = function() {
+    var color = `rgba(${this.r}, ${this.g}, ${this.b}, ${this.brightness})`;
+    ctx.beginPath();
+    ctx.arc(this.x, this.y, 2 * this.radius + 2 * this.siblings.length / SIBLINGS_LIMIT, 0, 2 * Math.PI);
+    ctx.fillStyle = color;
+    ctx.fill();
+  };
+
+  Node.prototype.drawConnections = function() {
+    for (var i = 0; i < this.siblings.length; i++) {
+      var color = `rgba(133, 133, 133, ${this.brightness})`;
+      ctx.beginPath();
+      ctx.moveTo(this.x, this.y);
+      ctx.lineTo(this.siblings[i].x, this.siblings[i].y);
+      ctx.lineWidth = 1 - calcDistance(this, this.siblings[i]) / SENSITIVITY;
+      ctx.strokeStyle = color;
+      ctx.stroke();
+    }
+  };
+
+
+  Node.prototype.moveNode = function() {
+    this.energy -= ENERGY_DECAY;
+    if (this.energy < 1) {
+      this.energy = Math.random() * 100;
+      if (this.x - this.anchorX < -ANCHOR_LENGTH) {
+        this.vx = Math.random() * SPEED_COEF;
+      } else if (this.x - this.anchorX > ANCHOR_LENGTH) {
+        this.vx = Math.random() * -SPEED_COEF;
+      } else {
+        this.vx = Math.random() * SPEED_COEF * 2 - SPEED_COEF;
+      }
+      if (this.y - this.anchorY < -ANCHOR_LENGTH) {
+        this.vy = Math.random() * SPEED_COEF;
+      } else if (this.y - this.anchorY > ANCHOR_LENGTH) {
+        this.vy = Math.random() * -SPEED_COEF;
+      } else {
+        this.vy = Math.random() * SPEED_COEF * 2 - SPEED_COEF;
+      }
+    }
+    relative_speed_rate = Math.min(canvas.height / 100, 10.0)
+    this.x += this.vx * this.energy * relative_speed_rate;
+    this.y += this.vy * this.energy * relative_speed_rate;
+  };
+
+  function initNodes() {
+    centralize_cursor();
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+    if (canvas.width >= SHOW_IF_WIDER_THAN)
+        total_nodes = Math.round(NODE_DENSITY * (canvas.width / 100 * canvas.height / 100));
+    else
+        total_nodes = 0;
+    nodes = [];
+    for (var i = 0; i < total_nodes; i++)
+        nodes.push(new Node(50 + Math.random() * (canvas.width - 100),
+                            5 + Math.random() * (canvas.height - 10)));
+  }
+
+  function calcDistance(node1, node2) {
+    return Math.sqrt(Math.pow(node1.x - node2.x, 2) + (Math.pow(node1.y - node2.y, 2)));
+  }
+
+  function findSiblings() {
+    var node1, node2, distance;
+    for (var i = 0; i < nodes.length; i++) {
+      node1 = nodes[i];
+      node1.siblings = [];
+      for (var j = 0; j < nodes.length; j++) {
+        node2 = nodes[j];
+        if (node1 !== node2) {
+          distance = calcDistance(node1, node2);
+          if (distance < SENSITIVITY) {
+            if (node1.siblings.length < SIBLINGS_LIMIT) {
+              node1.siblings.push(node2);
+            } else {
+              var node_sibling_distance = 0;
+              var max_distance = 0;
+              var s;
+              for (var k = 0; k < SIBLINGS_LIMIT; k++) {
+                node_sibling_distance = calcDistance(node1, node1.siblings[k]);
+                if (node_sibling_distance > max_distance) {
+                  max_distance = node_sibling_distance;
+                  s = k;
+                }
+              }
+              if (distance < max_distance) {
+                node1.siblings.splice(s, 1);
+                node1.siblings.push(node2);
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+  function redrawScene() {
+    resizeWindow();
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+    findSiblings();
+    var i, node, distance;
+    for (i = 0; i < nodes.length; i++) {
+      node = nodes[i];
+      scaled_distance = calcDistance({x: cursor.x / CURSOR_WIDTH, y: cursor.y / CURSOR_HEIGHT},
+                                     {x: node.x / CURSOR_WIDTH, y: node.y / CURSOR_HEIGHT});
+
+      node.brightness = Math.max(1 - scaled_distance, 0);
+    }
+    for (i = 0; i < nodes.length; i++) {
+      node = nodes[i];
+      if (node.brightness) {
+        node.drawConnections();
+        node.drawNode();
+      }
+      node.moveNode();
+    }
+    requestAnimationFrame(redrawScene);
+  }
+
+  function initHandlers() {
+    document.addEventListener('resize', resizeWindow);
+    document.addEventListener('orientationchange', resizeWindow);
+    if (MOVE_ON_CURSOR) {
+        document.addEventListener('mousemove', moveHandler);
+        document.addEventListener('touchmove', moveHandler);
+    }
+  }
+
+  function resizeWindow(evt) {
+    var new_width, new_height;
+    new_width = Math.round(Math.max(title_elem.getBoundingClientRect().right, window.innerWidth))
+    if (screen.width < 640)
+      title_text.style.fontSize = "24px";
+    else
+      title_text.style.fontSize = "32px";
+
+
+    if (!MOVE_ON_CURSOR)
+        new_height = Math.round(title_elem.getBoundingClientRect().top - canvas.getBoundingClientRect().top);
+    else
+        new_height = Math.round(Math.max(
+            content_element.offsetHeight, content_element.scrollHeight,
+            content_element.clientHeight, window.innerHeight));
+
+    if (canvas.width != new_width || canvas.height != new_height) {
+        canvas.width = new_width;
+        canvas.height = new_height;
+        initNodes();
+    }
+    if (!MOVE_ON_CURSOR)
+        centralize_cursor();
+  }
+
+  function moveHandler(evt) {
+    if (evt.type == "mousemove") {
+        cursor.x = window.pageXOffset + evt.clientX;
+        cursor.y = window.pageYOffset + evt.clientY;
+    }
+    else { // touch event
+        cursor.x = window.pageXOffset + evt.changedTouches[0].clientX;
+        cursor.y = window.pageYOffset + evt.changedTouches[0].clientY;
+    }
+  }
+
+  initHandlers();
+  initNodes();
+  redrawScene();
+
+})();

static/header_style.css

@@ -0,0 +1,148 @@
+:root {
+  --border-color: black;
+  --window-color: white;
+  --background-move-on-cursor: false;
+  --background-color: white;
+  --background-cursor-width: 400;
+  --background-cursor-height: 200;
+  --background-show-if-wider-than: 500;
+  --background-speed: 0.001;
+  --energy-decay: 0.3;
+}
+body {
+  width: 100%;
+  margin: 0 auto;
+  background-color: var(--background-color);
+}
+#container {
+  position: relative;
+  width: 100%;
+  margin: 0 auto;
+}
+#container canvas, #overlay {
+  width: 100%;
+  margin: 0 auto;
+  position: absolute;
+}
+canvas {
+  background-color: var(--background-color);
+  width: 0px; /* will be changed on init */
+  overflow: hidden;
+}
+#main_window {
+  width: 80%;
+  min-width: 320px;
+  margin: 0 auto;
+  text-align: center;
+}
+.faded {
+  margin: 0 auto;
+  background: var(--window-color);
+  box-shadow: 0 0 5px 5px var(--window-color);
+  font-family: cursive;
+  font-family: "Gill Sans", sans-serif;
+  display: inline-block
+}
+.padded {
+    width: 100%;
+    max-width: 800px;
+    text-align: left;
+}
+.title {
+   font-size: 32px;
+   box-shadow: 0 0 5px 5px var(--window-color);
+   font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,
+                sans-serif,Apple Color Emoji,Segoe UI Emoji;
+}
+.text {
+   font-size: 16px;
+   box-shadow: 0 0 5px 5px var(--window-color);
+   font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,
+                sans-serif,Apple Color Emoji,Segoe UI Emoji;
+}
+.scrollbar {
+  overflow-y: scroll;
+}
+.arxiv_button {
+  position: relative;
+  display: inline-block;
+  width: 80px;
+  height: 28px;
+  background-image: linear-gradient(180deg, #fafbfc, #eff3f6 90%);
+  color: #24292e;
+  border: 1px solid rgba(27,31,35,.2);
+  text-align: center;
+  cursor: pointer;
+  border-radius: 4px;
+  padding-right: 0px;
+  padding-top: 2.5px;
+  font-size: 12px;
+  font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;
+  font-weight: 600;
+}
+.arxiv_button:before {
+  content: "";
+  vertical-align:middle;
+  display: inline-block;
+  width: 24px;
+  height: 24px;
+  border: none;
+  margin-left: -16px;
+  margin-right: 4px;
+  margin-top: -2px;
+  background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" class="ionicon s-ion-icon" viewBox="0 0 512 512"><path d="M428 224H288a48 48 0 01-48-48V36a4 4 0 00-4-4h-92a64 64 0 00-64 64v320a64 64 0 0064 64h224a64 64 0 0064-64V228a4 4 0 00-4-4z"></path><path d="M419.22 188.59L275.41 44.78a2 2 0 00-3.41 1.41V176a16 16 0 0016 16h129.81a2 2 0 001.41-3.41z"></path></svg>') right center no-repeat;
+  background-size: 18px 16px;
+}
+.arxiv_button:hover {
+    background-color:#e6ebf1;
+    background-position:-0.5em;
+    border-color: #9fa4a9;
+    border-color:rgba(27,31,35,.35);
+    background-image:linear-gradient(180deg, #f0f3f6, #e6ebf1 90%)
+}
+a:link {
+    color: #00194a;
+    text-decoration: none;
+}
+a:visited {
+    color: #3f004a;
+    text-decoration: none;
+}
+.tooltip {
+  position: relative;
+  display: inline-block;
+  border-bottom: 1px dotted black;
+}
+
+.tooltip .tooltiptext {
+  visibility: hidden;
+  width: 240px;
+  background-color: #555;
+  color: #fff;
+  text-align: center;
+  border-radius: 6px;
+  padding: 5px 0;
+  position: absolute;
+  z-index: 1;
+  bottom: 125%;
+  left: 50%;
+  margin-left: -60px;
+  opacity: 0;
+  transition: opacity 0.3s;
+}
+
+.tooltip .tooltiptext::after {
+  content: "";
+  position: absolute;
+  top: 100%;
+  left: 50%;
+  margin-left: -5px;
+  border-width: 5px;
+  border-style: solid;
+  border-color: #555 transparent transparent transparent;
+}
+
+.tooltip:hover .tooltiptext {
+  visibility: visible;
+  opacity: 1;
+}

static/meta.html

@@ -0,0 +1,21 @@
+<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+<title>learning@home</title>
+<meta name="description" content="A NeurIPS'21 demonstration that explains how to train large models together with multiple collaborators.">
+<link rel="mask-icon" href="https://learning-at-home.github.io/logo_small.png">
+<link rel="alternate icon" class="js-site-favicon" type="image/png" href="https://learning-at-home.github.io/logo.png">
+<link rel="icon" class="js-site-favicon" type="image/png" href="https://learning-at-home.github.io/logo.png">
+<meta property="og:url" content="https://training-transformers-together.github.io">
+<meta property="og:site_name" content="learning@home">
+<meta property="og:title" content="Train vast neural networks together">
+<meta property="og:description" content="A library to train large neural networks across the internet. Imagine training one huge transformer on thousands of computers from universities, companies, and volunteers.">
+<meta property="og:image" content="https://learning-at-home.github.io/logo_small.png">
+<meta property="og:image:type" content="image/png">
+<meta property="og:image:width" content="96">
+<meta property="og:image:height" content="96">
+<meta property="twitter:site" content="https://training-transformers-together.github.io">
+<meta property="twitter:creator" content="Yandex, Huggingface, Hivemind team & contributors">
+<meta property="twitter:card" content="summary_large_image">
+<meta property="twitter:title" content="learning@home">
+<meta property="twitter:description" content="Hivemind is a library to train large neural networks across the internet. Imagine training one huge transformer on thousands of computers from universities, companies, and volunteers.">
+<meta property="twitter:image:src" content="https://learning-at-home.github.io/logo_horizontal.png">
+<meta name="viewport" content="width=device-width, initial-scale=1">

streamlit_observable/__init__.py

@@ -0,0 +1,71 @@
+import os
+
+import streamlit.components.v1 as components
+
+_RELEASE = True
+
+if not _RELEASE:
+    _component_func = components.declare_component(
+        "observable",
+        url="http://localhost:3001",
+    )
+else:
+    parent_dir = os.path.dirname(os.path.abspath(__file__))
+    build_dir = os.path.join(parent_dir, "frontend", "build")
+    _component_func = components.declare_component("observable", path=build_dir)
+
+
+def observable(key, notebook, targets=None, redefine={}, observe=[], hide=[]):
+    """Create a new instance of "observable".
+
+    Parameters
+    ----------
+    key: str
+        A unique string used to avoid constant re-renders to the iframe.
+    notebook: str
+        The observablehq.com notebook id to embed. Ex. "@"d3/bar-chart"
+        or "d/1f434ef3b0569a00"
+    targets: list or None
+        An optional list of strings that are the name of the cells to embed.
+        By default, the entire notebook, including unnamed cells, will be embeded.
+    observe: list or None
+        An optional list of strings that are the name of cells to observe.
+        Whenever these cells change value or become fulfilled, the value will
+        be passed back into Streamlit as part of the return value.
+    redefine: dict or None
+        An optional dict containing the cells you wish to redefine and the values
+        you wish to redefine them as. The keys are the cell names you want to
+        redefine, the values are what they will be redefined as. Keep in mind,
+        there is a serialization process from Streamlit Python -> frontend JavaScript.
+    hide: list or None
+        An option list of strings that are the names of cells that will be embeded,
+        but won't be rendered to the DOM.
+    Returns
+    -------
+    dict
+        An object containing the live observed values. If the observe parameter is
+        empty, then the dict will be empty. The keys are the name of the cell that
+        is observe, the values are the values of the cells.
+
+    """
+    component_value = _component_func(
+        notebook=notebook, targets=targets, observe=observe, redefine=redefine, hide=hide, key=key, name=key
+    )
+
+    if component_value is None:
+        return {}
+
+    return component_value
+
+
+# if not _RELEASE:
+#     import streamlit as st
+#     observers = observable("World Tour!",
+#         notebook="@d3/world-tour",
+#         targets=["canvas"],
+#         observe=["name"]
+#     )
+
+#     name = observers.get("name")
+
+#     st.write(f"Current country: ** *{name}* **")

streamlit_observable/frontend/build/asset-manifest.json

@@ -0,0 +1,20 @@
+{
+  "files": {
+    "main.js": "./static/js/main.5bdac2e3.chunk.js",
+    "main.js.map": "./static/js/main.5bdac2e3.chunk.js.map",
+    "runtime-main.js": "./static/js/runtime-main.11ec9aca.js",
+    "runtime-main.js.map": "./static/js/runtime-main.11ec9aca.js.map",
+    "static/js/2.b1c975ff.chunk.js": "./static/js/2.b1c975ff.chunk.js",
+    "static/js/2.b1c975ff.chunk.js.map": "./static/js/2.b1c975ff.chunk.js.map",
+    "index.html": "./index.html",
+    "precache-manifest.8096ee623e3f349cc3813a91ceb00929.js": "./precache-manifest.8096ee623e3f349cc3813a91ceb00929.js",
+    "service-worker.js": "./service-worker.js",
+    "static/js/2.b1c975ff.chunk.js.LICENSE.txt": "./static/js/2.b1c975ff.chunk.js.LICENSE.txt",
+    "static/js/main.5bdac2e3.chunk.js.LICENSE.txt": "./static/js/main.5bdac2e3.chunk.js.LICENSE.txt"
+  },
+  "entrypoints": [
+    "static/js/runtime-main.11ec9aca.js",
+    "static/js/2.b1c975ff.chunk.js",
+    "static/js/main.5bdac2e3.chunk.js"
+  ]
+}

streamlit_observable/frontend/build/index.html

@@ -0,0 +1 @@
+<!doctype html><html lang="en"><head><title>Streamlit Component</title><meta charset="UTF-8"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Streamlit Component"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@observablehq/inspector@3/dist/inspector.css"/></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script>!function(e){function t(t){for(var n,l,a=t[0],p=t[1],i=t[2],c=0,s=[];c<a.length;c++)l=a[c],Object.prototype.hasOwnProperty.call(o,l)&&o[l]&&s.push(o[l][0]),o[l]=0;for(n in p)Object.prototype.hasOwnProperty.call(p,n)&&(e[n]=p[n]);for(f&&f(t);s.length;)s.shift()();return u.push.apply(u,i||[]),r()}function r(){for(var e,t=0;t<u.length;t++){for(var r=u[t],n=!0,a=1;a<r.length;a++){var p=r[a];0!==o[p]&&(n=!1)}n&&(u.splice(t--,1),e=l(l.s=r[0]))}return e}var n={},o={1:0},u=[];function l(t){if(n[t])return n[t].exports;var r=n[t]={i:t,l:!1,exports:{}};return e[t].call(r.exports,r,r.exports,l),r.l=!0,r.exports}l.m=e,l.c=n,l.d=function(e,t,r){l.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},l.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},l.t=function(e,t){if(1&t&&(e=l(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(l.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)l.d(r,n,function(t){return e[t]}.bind(null,n));return r},l.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return l.d(t,"a",t),t},l.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},l.p="./";var a=this.webpackJsonpstreamlit_component_template=this.webpackJsonpstreamlit_component_template||[],p=a.push.bind(a);a.push=t,a=a.slice();for(var i=0;i<a.length;i++)t(a[i]);var f=p;r()}([])</script><script src="./static/js/2.b1c975ff.chunk.js"></script><script src="./static/js/main.5bdac2e3.chunk.js"></script></body></html>

streamlit_observable/frontend/build/precache-manifest.8096ee623e3f349cc3813a91ceb00929.js

@@ -0,0 +1,26 @@
+self.__precacheManifest = (self.__precacheManifest || []).concat([
+  {
+    "revision": "2ec6acc026cff43b53185364bb91d16e",
+    "url": "./index.html"
+  },
+  {
+    "revision": "5a67f673dcdf30bf693d",
+    "url": "./static/js/2.b1c975ff.chunk.js"
+  },
+  {
+    "revision": "9b318b6fb13190fe82c0677e9264b3c7",
+    "url": "./static/js/2.b1c975ff.chunk.js.LICENSE.txt"
+  },
+  {
+    "revision": "36b8de6fe4fc2eeae54b",
+    "url": "./static/js/main.5bdac2e3.chunk.js"
+  },
+  {
+    "revision": "6515c66d2a8747a146d578e1c038a822",
+    "url": "./static/js/main.5bdac2e3.chunk.js.LICENSE.txt"
+  },
+  {
+    "revision": "7c26bca7e16783d14d15",
+    "url": "./static/js/runtime-main.11ec9aca.js"
+  }
+]);

streamlit_observable/frontend/build/service-worker.js

@@ -0,0 +1,39 @@
+/**
+ * Welcome to your Workbox-powered service worker!
+ *
+ * You'll need to register this file in your web app and you should
+ * disable HTTP caching for this file too.
+ * See https://goo.gl/nhQhGp
+ *
+ * The rest of the code is auto-generated. Please don't update this file
+ * directly; instead, make changes to your Workbox build configuration
+ * and re-run your build process.
+ * See https://goo.gl/2aRDsh
+ */
+
+importScripts("https://storage.googleapis.com/workbox-cdn/releases/4.3.1/workbox-sw.js");
+
+importScripts(
+  "./precache-manifest.8096ee623e3f349cc3813a91ceb00929.js"
+);
+
+self.addEventListener('message', (event) => {
+  if (event.data && event.data.type === 'SKIP_WAITING') {
+    self.skipWaiting();
+  }
+});
+
+workbox.core.clientsClaim();
+
+/**
+ * The workboxSW.precacheAndRoute() method efficiently caches and responds to
+ * requests for URLs in the manifest.
+ * See https://goo.gl/S9QRab
+ */
+self.__precacheManifest = [].concat(self.__precacheManifest || []);
+workbox.precaching.precacheAndRoute(self.__precacheManifest, {});
+
+workbox.routing.registerNavigationRoute(workbox.precaching.getCacheKeyForURL("./index.html"), {
+  
+  blacklist: [/^\/_/,/\/[^/?]+\.[^/]+$/],
+});

streamlit_observable/frontend/build/static/js/2.b1c975ff.chunk.js.LICENSE.txt

@@ -0,0 +1,41 @@
+/*
+object-assign
+(c) Sindre Sorhus
+@license MIT
+*/
+
+/** @license React v0.19.1
+ * scheduler.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.13.1
+ * react-is.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.14.0
+ * react-dom.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.14.0
+ * react.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */

streamlit_observable/frontend/build/static/js/main.5bdac2e3.chunk.js

@@ -0,0 +1,3 @@
+/*! For license information please see main.5bdac2e3.chunk.js.LICENSE.txt */
+(this.webpackJsonpstreamlit_component_template=this.webpackJsonpstreamlit_component_template||[]).push([[0],{18:function(e,_,t){"use strict";t.d(_,"b",(function(){return p})),t.d(_,"c",(function(){return E})),t.d(_,"a",(function(){return h}));var r,n=t(0),a=t(4),o=t(2),s=t(3),i=t(36),l=t.n(i),u=t(12),d=t.n(u),c=t(10),m=t(37),b=t(24),g=function(){function e(_,t,r,a){var o=this;Object(n.a)(this,e),this.dataTable=void 0,this.indexTable=void 0,this.columnsTable=void 0,this.styler=void 0,this.getCell=function(e,_){var t=e<o.headerRows&&_<o.headerColumns,r=e>=o.headerRows&&_<o.headerColumns,n=e<o.headerRows&&_>=o.headerColumns;if(t){var a=["blank"];return _>0&&a.push("level"+e),{type:"blank",classNames:a.join(" "),content:""}}if(n){var s=_-o.headerColumns;return{type:"columns",classNames:["col_heading","level"+e,"col"+s].join(" "),content:o.getContent(o.columnsTable,s,e)}}if(r){var i=e-o.headerRows,l=["row_heading","level"+_,"row"+i];return{type:"index",id:"T_".concat(o.uuid,"level").concat(_,"_row").concat(i),classNames:l.join(" "),content:o.getContent(o.indexTable,i,_)}}var u=e-o.headerRows,d=_-o.headerColumns,c=["data","row"+u,"col"+d],m=o.styler?o.getContent(o.styler.displayValuesTable,u,d):o.getContent(o.dataTable,u,d);return{type:"data",id:"T_".concat(o.uuid,"row").concat(u,"_col").concat(d),classNames:c.join(" "),content:m}},this.getContent=function(e,_,t){var r=e.getColumnAt(t);if(null===r)return"";switch(o.getColumnTypeId(e,t)){case b.b.Timestamp:return o.nanosToDate(r.get(_));default:return r.get(_)}},this.dataTable=b.a.from(_),this.indexTable=b.a.from(t),this.columnsTable=b.a.from(r),this.styler=a?{caption:a.get("caption"),displayValuesTable:b.a.from(a.get("displayValues")),styles:a.get("styles"),uuid:a.get("uuid")}:void 0}return Object(a.a)(e,[{key:"rows",get:function(){return this.indexTable.length+this.columnsTable.numCols}},{key:"columns",get:function(){return this.indexTable.numCols+this.columnsTable.length}},{key:"headerRows",get:function(){return this.rows-this.dataRows}},{key:"headerColumns",get:function(){return this.columns-this.dataColumns}},{key:"dataRows",get:function(){return this.dataTable.length}},{key:"dataColumns",get:function(){return this.dataTable.numCols}},{key:"uuid",get:function(){return this.styler&&this.styler.uuid}},{key:"caption",get:function(){return this.styler&&this.styler.caption}},{key:"styles",get:function(){return this.styler&&this.styler.styles}},{key:"table",get:function(){return this.dataTable}},{key:"index",get:function(){return this.indexTable}},{key:"columnTable",get:function(){return this.columnsTable}},{key:"getColumnTypeId",value:function(e,_){return e.schema.fields[_].type.typeId}},{key:"nanosToDate",value:function(e){return new Date(e/1e6)}}]),e}();!function(e){e.COMPONENT_READY="streamlit:componentReady",e.SET_COMPONENT_VALUE="streamlit:setComponentValue",e.SET_FRAME_HEIGHT="streamlit:setFrameHeight"}(r||(r={}));var h=function e(){Object(n.a)(this,e)};h.API_VERSION=1,h.RENDER_EVENT="streamlit:render",h.events=new m.a,h.registeredMessageListener=!1,h.lastFrameHeight=void 0,h.setComponentReady=function(){h.registeredMessageListener||(window.addEventListener("message",h.onMessageEvent),h.registeredMessageListener=!0),h.sendBackMsg(r.COMPONENT_READY,{apiVersion:h.API_VERSION})},h.setFrameHeight=function(e){void 0===e&&(e=document.body.scrollHeight+10),e!==h.lastFrameHeight&&(h.lastFrameHeight=e,h.sendBackMsg(r.SET_FRAME_HEIGHT,{height:e}))},h.setComponentValue=function(e){h.sendBackMsg(r.SET_COMPONENT_VALUE,{value:e})},h.onMessageEvent=function(e){switch(e.data.type){case h.RENDER_EVENT:h.onRenderMessage(e.data)}},h.onRenderMessage=function(e){var _=e.args;null==_&&(console.error("Got null args in onRenderMessage. This should never happen"),_={});var t=e.dfs&&e.dfs.length>0?h.argsDataframeToObject(e.dfs):{};_=Object(c.a)(Object(c.a)({},_),t);var r={disabled:Boolean(e.disabled),args:_},n=new CustomEvent(h.RENDER_EVENT,{detail:r});h.events.dispatchEvent(n)},h.argsDataframeToObject=function(e){var _=e.map((function(e){var _=e.key,t=e.value;return[_,h.toArrowTable(t)]}));return Object.fromEntries(_)},h.toArrowTable=function(e){var _=e.data,t=_.data,r=_.index,n=_.columns;return new g(t,r,n)},h.sendBackMsg=function(e,_){window.parent.postMessage(Object(c.a)({isStreamlitMessage:!0,type:e},_),"*")};var p=function(e){Object(o.a)(t,e);var _=Object(s.a)(t);function t(){return Object(n.a)(this,t),_.apply(this,arguments)}return Object(a.a)(t,[{key:"componentDidMount",value:function(){h.setFrameHeight()}},{key:"componentDidUpdate",value:function(){h.setFrameHeight()}}]),t}(d.a.PureComponent);function E(e){var _=function(_){Object(o.a)(r,_);var t=Object(s.a)(r);function r(_){var a;return Object(n.a)(this,r),(a=t.call(this,_)).componentDidMount=function(){h.events.addEventListener(h.RENDER_EVENT,a.onRenderEvent),h.setComponentReady()},a.componentDidUpdate=function(e){null!=a.state.componentError&&h.setFrameHeight()},a.componentWillUnmount=function(){h.events.removeEventListener(h.RENDER_EVENT,a.onRenderEvent)},a.onRenderEvent=function(e){var _=e;a.setState({renderData:_.detail})},a.render=function(){return null!=a.state.componentError?d.a.createElement("div",null,d.a.createElement("h1",null,"Component Error"),d.a.createElement("span",null,a.state.componentError.message)):null==a.state.renderData?null:d.a.createElement(e,{width:window.innerWidth,disabled:a.state.renderData.disabled,args:a.state.renderData.args})},a.state={renderData:void 0,componentError:void 0},a}return r}(d.a.PureComponent);return _.getDerivedStateFromError=function(e){return{componentError:e}},l()(_,e)}},35:function(module,__webpack_exports__,__webpack_require__){"use strict";var _mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__(7),_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_helpers_esm_createForOfIteratorHelper__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__(8),_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__(1),_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default=__webpack_require__.n(_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2__),_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_helpers_esm_asyncToGenerator__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__(5),_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__(0),_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__(4),_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_helpers_esm_inherits__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__(2),_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_helpers_esm_createSuper__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__(3),react__WEBPACK_IMPORTED_MODULE_8__=__webpack_require__(12),react__WEBPACK_IMPORTED_MODULE_8___default=__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_8__),_streamlit__WEBPACK_IMPORTED_MODULE_9__=__webpack_require__(18),_observablehq_runtime__WEBPACK_IMPORTED_MODULE_10__=__webpack_require__(30),Observable=function(_StreamlitComponentBa){Object(_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_helpers_esm_inherits__WEBPACK_IMPORTED_MODULE_6__.a)(Observable,_StreamlitComponentBa);var _super=Object(_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_helpers_esm_createSuper__WEBPACK_IMPORTED_MODULE_7__.a)(Observable);function Observable(){var e;Object(_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_4__.a)(this,Observable);for(var _=arguments.length,t=new Array(_),r=0;r<_;r++)t[r]=arguments[r];return(e=_super.call.apply(_super,[this].concat(t))).observeValue={},e.notebookRef=react__WEBPACK_IMPORTED_MODULE_8___default.a.createRef(),e.runtime=null,e.main=null,e.render=function(){return react__WEBPACK_IMPORTED_MODULE_8___default.a.createElement("div",{style:{border:"1px solid gray",borderRadius:"4px"}},react__WEBPACK_IMPORTED_MODULE_8___default.a.createElement("div",{style:{padding:"9px 12px"}},react__WEBPACK_IMPORTED_MODULE_8___default.a.createElement("div",{ref:e.notebookRef})),react__WEBPACK_IMPORTED_MODULE_8___default.a.createElement("div",{style:{marginTop:"4px"}},react__WEBPACK_IMPORTED_MODULE_8___default.a.createElement("div",{style:{backgroundColor:"#ddd",fontWeight:700,padding:".25rem .5rem",borderRadius:"0 0 4px 4px",gridTemplateColumns:"auto auto",display:"grid"}},react__WEBPACK_IMPORTED_MODULE_8___default.a.createElement("div",{style:{textAlign:"left"}},e.props.args.name),react__WEBPACK_IMPORTED_MODULE_8___default.a.createElement("div",{style:{textAlign:"right"}},react__WEBPACK_IMPORTED_MODULE_8___default.a.createElement("a",{href:"https://observablehq.com/".concat(e.props.args.notebook),style:{color:"#666"}})))))},e}return Object(_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_5__.a)(Observable,[{key:"componentWillUnmount",value:function(){var e;null===(e=this.runtime)||void 0===e||e.dispose()}},{key:"componentDidUpdate",value:function(e){e.args.notebook,this.props.args.notebook,this.redefineCells(this.main,this.props.args.redefine)}},{key:"embedNotebook",value:function(){var _embedNotebook=Object(_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_helpers_esm_asyncToGenerator__WEBPACK_IMPORTED_MODULE_3__.a)(_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default.a.mark((function _callee2(notebook,targets,observe,hide){var _this2=this,targetSet,observeSet,hideSet,_yield$eval,define;return _mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default.a.wrap((function _callee2$(_context2){for(;;)switch(_context2.prev=_context2.next){case 0:return this.runtime&&this.runtime.dispose(),targetSet=new Set(targets),observeSet=new Set(observe),hideSet=new Set(hide),this.runtime=new _observablehq_runtime__WEBPACK_IMPORTED_MODULE_10__.b,_context2.next=7,eval('import("https://api.observablehq.com/'.concat(notebook,'.js?v=3")'));case 7:_yield$eval=_context2.sent,define=_yield$eval.default,this.main=this.runtime.module(define,(function(e){var _;if(observeSet.has(e)&&!targetSet.has(e)){var t=_this2.observeValue;return{fulfilled:function(_){t[e]=_,_streamlit__WEBPACK_IMPORTED_MODULE_9__.a.setComponentValue(t)}}}if(!(targetSet.size>0)||targetSet.has(e)){if(hideSet.has(e))return!0;var r=document.createElement("div");null===(_=_this2.notebookRef.current)||void 0===_||_.appendChild(r);var n=new _observablehq_runtime__WEBPACK_IMPORTED_MODULE_10__.a(r);return r.addEventListener("input",(function(e){_streamlit__WEBPACK_IMPORTED_MODULE_9__.a.setFrameHeight()})),{pending:function(){n.pending(),_streamlit__WEBPACK_IMPORTED_MODULE_9__.a.setFrameHeight()},fulfilled:function(e){n.fulfilled(e),_streamlit__WEBPACK_IMPORTED_MODULE_9__.a.setFrameHeight()},rejected:function(e){n.rejected(e),_streamlit__WEBPACK_IMPORTED_MODULE_9__.a.setFrameHeight()}}}})),observeSet.size>0&&Promise.all(Array.from(observeSet).map(function(){var e=Object(_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_helpers_esm_asyncToGenerator__WEBPACK_IMPORTED_MODULE_3__.a)(_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default.a.mark((function e(_){return _mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_regenerator__WEBPACK_IMPORTED_MODULE_2___default.a.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.t0=_,e.next=3,_this2.main.value(_);case 3:return e.t1=e.sent,e.abrupt("return",[e.t0,e.t1]);case 5:case"end":return e.stop()}}),e)})));return function(_){return e.apply(this,arguments)}}())).then((function(e){var _,t=Object(_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_helpers_esm_createForOfIteratorHelper__WEBPACK_IMPORTED_MODULE_1__.a)(e);try{for(t.s();!(_=t.n()).done;){var r=Object(_mnt_storage_Documents_hugging_face_colaborative_hub_training_demo_neurips_training_transformers_together_dashboard_streamlit_observable_frontend_node_modules_babel_preset_react_app_node_modules_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__.a)(_.value,2),n=r[0],a=r[1];_this2.observeValue[n]=a}}catch(o){t.e(o)}finally{t.f()}_streamlit__WEBPACK_IMPORTED_MODULE_9__.a.setComponentValue(_this2.observeValue)}));case 11:case"end":return _context2.stop()}}),_callee2,this)})));function embedNotebook(e,_,t,r){return _embedNotebook.apply(this,arguments)}return embedNotebook}()},{key:"redefineCells",value:function(e){var _=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};for(var t in _)e.redefine(t,_[t])}},{key:"componentDidMount",value:function(){var e=this,_=this.props.args,t=_.notebook,r=_.targets,n=void 0===r?[]:r,a=_.observe,o=void 0===a?[]:a,s=_.redefine,i=void 0===s?{}:s,l=_.hide,u=void 0===l?[]:l;_streamlit__WEBPACK_IMPORTED_MODULE_9__.a.setComponentValue(this.observeValue),this.embedNotebook(t,n,o,u).then((function(){e.redefineCells(e.main,i)}))}}]),Observable}(_streamlit__WEBPACK_IMPORTED_MODULE_9__.b);__webpack_exports__.a=Object(_streamlit__WEBPACK_IMPORTED_MODULE_9__.c)(Observable)},40:function(e,_,t){e.exports=t(41)},41:function(e,_,t){"use strict";t.r(_);var r=t(12),n=t.n(r),a=t(34),o=t.n(a),s=t(35);o.a.render(n.a.createElement(n.a.StrictMode,null,n.a.createElement(s.a,null)),document.getElementById("root"))}},[[40,1,2]]]);
+//# sourceMappingURL=main.5bdac2e3.chunk.js.map

streamlit_observable/frontend/build/static/js/main.5bdac2e3.chunk.js.LICENSE.txt

@@ -0,0 +1,16 @@
+/**
+ * @license
+ * Copyright 2018-2020 Streamlit Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */

streamlit_observable/frontend/build/static/js/main.5bdac2e3.chunk.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["streamlit/streamlit.ts","streamlit/ArrowTable.ts","streamlit/StreamlitReact.tsx","Observable.tsx","index.tsx"],"names":["ComponentMessageType","ArrowTable","dataBuffer","indexBuffer","columnsBuffer","styler","dataTable","indexTable","columnsTable","getCell","rowIndex","columnIndex","isBlankCell","headerRows","headerColumns","isIndexCell","isColumnsCell","classNames","push","type","join","content","dataColumnIndex","getContent","dataRowIndex","id","uuid","displayValuesTable","table","column","getColumnAt","getColumnTypeId","Type","Timestamp","nanosToDate","get","this","Table","from","caption","styles","undefined","length","numCols","rows","dataRows","columns","dataColumns","schema","fields","typeId","nanos","Date","Streamlit","API_VERSION","RENDER_EVENT","events","EventTarget","registeredMessageListener","lastFrameHeight","setComponentReady","window","addEventListener","onMessageEvent","sendBackMsg","COMPONENT_READY","apiVersion","setFrameHeight","height","document","body","scrollHeight","SET_FRAME_HEIGHT","setComponentValue","value","SET_COMPONENT_VALUE","event","data","onRenderMessage","args","console","error","dataframeArgs","argsDataframeToObject","eventData","disabled","Boolean","CustomEvent","detail","dispatchEvent","argsDataframe","argsDataframeArrow","map","key","toArrowTable","Object","fromEntries","df","index","parent","postMessage","isStreamlitMessage","StreamlitComponentBase","React","PureComponent","withStreamlitConnection","WrappedComponent","ComponentWrapper","props","componentDidMount","onRenderEvent","componentDidUpdate","prevProps","state","componentError","componentWillUnmount","removeEventListener","renderEvent","setState","renderData","render","message","width","innerWidth","getDerivedStateFromError","hoistNonReactStatics","Observable","observeValue","notebookRef","createRef","runtime","main","style","border","borderRadius","padding","ref","marginTop","backgroundColor","fontWeight","gridTemplateColumns","display","textAlign","name","href","notebook","color","dispose","redefineCells","redefine","targets","observe","hide","a","targetSet","Set","observeSet","hideSet","Runtime","eval","define","default","module","has","fulfilled","size","el","createElement","current","appendChild","i","Inspector","e","pending","rejected","Promise","all","Array","then","initial","cell","embedNotebook","ReactDOM","StrictMode","getElementById"],"mappings":"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","file":"static/js/main.5bdac2e3.chunk.js","sourcesContent":["/**\n * @license\n * Copyright 2018-2020 Streamlit Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *    http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n// Safari doesn't support the EventTarget class, so we use a shim.\nimport { EventTarget } from \"event-target-shim\"\nimport { ArrowDataframeProto, ArrowTable } from \"./ArrowTable\"\n\n/** Data sent in the custom Streamlit render event. */\nexport interface RenderData {\n  args: any\n  disabled: boolean\n}\n\n/** Messages from Component -> Streamlit */\nenum ComponentMessageType {\n  // A component sends this message when it's ready to receive messages\n  // from Streamlit. Streamlit won't send any messages until it gets this.\n  // Data: { apiVersion: number }\n  COMPONENT_READY = \"streamlit:componentReady\",\n\n  // The component has a new widget value. Send it back to Streamlit, which\n  // will then re-run the app.\n  // Data: { value: any }\n  SET_COMPONENT_VALUE = \"streamlit:setComponentValue\",\n\n  // The component has a new height for its iframe.\n  // Data: { height: number }\n  SET_FRAME_HEIGHT = \"streamlit:setFrameHeight\",\n}\n\n/**\n * Streamlit communication API.\n *\n * Components can send data to Streamlit via the functions defined here,\n * and receive data from Streamlit via the `events` property.\n */\nexport class Streamlit {\n  /**\n   * The Streamlit component API version we're targetting.\n   * There's currently only 1!\n   */\n  public static readonly API_VERSION = 1\n\n  public static readonly RENDER_EVENT = \"streamlit:render\"\n\n  /** Dispatches events received from Streamlit. */\n  public static readonly events = new EventTarget()\n\n  private static registeredMessageListener = false\n  private static lastFrameHeight?: number\n\n  /**\n   * Tell Streamlit that the component is ready to start receiving data.\n   * Streamlit will defer emitting RENDER events until it receives the\n   * COMPONENT_READY message.\n   */\n  public static setComponentReady = (): void => {\n    if (!Streamlit.registeredMessageListener) {\n      // Register for message events if we haven't already\n      window.addEventListener(\"message\", Streamlit.onMessageEvent)\n      Streamlit.registeredMessageListener = true\n    }\n\n    Streamlit.sendBackMsg(ComponentMessageType.COMPONENT_READY, {\n      apiVersion: Streamlit.API_VERSION,\n    })\n  }\n\n  /**\n   * Report the component's height to Streamlit.\n   * This should be called every time the component changes its DOM - that is,\n   * when it's first loaded, and any time it updates.\n   */\n  public static setFrameHeight = (height?: number): void => {\n    if (height === undefined) {\n      // `height` is optional. If undefined, it defaults to scrollHeight,\n      // which is the entire height of the element minus its border,\n      // scrollbar, and margin.\n      height = document.body.scrollHeight + 10;\n    }\n\n    if (height === Streamlit.lastFrameHeight) {\n      // Don't bother updating if our height hasn't changed.\n      return\n    }\n\n    Streamlit.lastFrameHeight = height\n    Streamlit.sendBackMsg(ComponentMessageType.SET_FRAME_HEIGHT, { height })\n  }\n\n  /**\n   * Set the component's value. This value will be returned to the Python\n   * script, and the script will be re-run.\n   *\n   * For example:\n   *\n   * JavaScript:\n   * Streamlit.setComponentValue(\"ahoy!\")\n   *\n   * Python:\n   * value = st.my_component(...)\n   * st.write(value) # -> \"ahoy!\"\n   *\n   * The value must be serializable into JSON.\n   */\n  public static setComponentValue = (value: any): void => {\n    Streamlit.sendBackMsg(ComponentMessageType.SET_COMPONENT_VALUE, { value })\n  }\n\n  /** Receive a ForwardMsg from the Streamlit app */\n  private static onMessageEvent = (event: MessageEvent): void => {\n    const type = event.data[\"type\"]\n    switch (type) {\n      case Streamlit.RENDER_EVENT:\n        Streamlit.onRenderMessage(event.data)\n        break\n    }\n  }\n\n  /**\n   * Handle an untyped Streamlit render event and redispatch it as a\n   * StreamlitRenderEvent.\n   */\n  private static onRenderMessage = (data: any): void => {\n    let args = data[\"args\"]\n    if (args == null) {\n      console.error(\n        `Got null args in onRenderMessage. This should never happen`\n      )\n      args = {}\n    }\n\n    // Parse our dataframe arguments with arrow, and merge them into our args dict\n    const dataframeArgs =\n      data[\"dfs\"] && data[\"dfs\"].length > 0\n        ? Streamlit.argsDataframeToObject(data[\"dfs\"])\n        : {}\n\n    args = {\n      ...args,\n      ...dataframeArgs,\n    }\n\n    const disabled = Boolean(data[\"disabled\"])\n\n    // Dispatch a render event!\n    const eventData = { disabled, args }\n    const event = new CustomEvent<RenderData>(Streamlit.RENDER_EVENT, {\n      detail: eventData,\n    })\n    Streamlit.events.dispatchEvent(event)\n  }\n\n  private static argsDataframeToObject = (\n    argsDataframe: ArgsDataframe[]\n  ): object => {\n    const argsDataframeArrow = argsDataframe.map(\n      ({ key, value }: ArgsDataframe) => [key, Streamlit.toArrowTable(value)]\n    )\n    return Object.fromEntries(argsDataframeArrow)\n  }\n\n  private static toArrowTable = (df: ArrowDataframeProto): ArrowTable => {\n    const { data, index, columns } = df.data\n    return new ArrowTable(data, index, columns)\n  }\n\n  /** Post a message to the Streamlit app. */\n  private static sendBackMsg = (type: string, data?: any): void => {\n    window.parent.postMessage(\n      {\n        isStreamlitMessage: true,\n        type: type,\n        ...data,\n      },\n      \"*\"\n    )\n  }\n}\n\ninterface ArgsDataframe {\n  key: string\n  value: ArrowDataframeProto\n}\n","/**\n * @license\n * Copyright 2018-2019 Streamlit Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *    http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Table, Type } from \"apache-arrow\"\n\ntype CellType = \"blank\" | \"index\" | \"columns\" | \"data\"\n\nexport interface ArrowDataframeProto {\n  data: ArrowTableProto\n  height: string\n  width: string\n}\n\nexport interface ArrowTableProto {\n  data: Uint8Array\n  index: Uint8Array\n  columns: Uint8Array\n  styler: Styler\n}\n\ninterface Cell {\n  classNames: string\n  content: string\n  id?: string\n  type: CellType\n}\n\ninterface Styler {\n  caption?: string\n  displayValuesTable: Table\n  styles?: string\n  uuid: string\n}\n\nexport class ArrowTable {\n  private readonly dataTable: Table\n  private readonly indexTable: Table\n  private readonly columnsTable: Table\n  private readonly styler?: Styler\n\n  constructor(\n    dataBuffer: Uint8Array,\n    indexBuffer: Uint8Array,\n    columnsBuffer: Uint8Array,\n    styler?: any\n  ) {\n    this.dataTable = Table.from(dataBuffer)\n    this.indexTable = Table.from(indexBuffer)\n    this.columnsTable = Table.from(columnsBuffer)\n    this.styler = styler\n      ? {\n          caption: styler.get(\"caption\"),\n          displayValuesTable: Table.from(styler.get(\"displayValues\")),\n          styles: styler.get(\"styles\"),\n          uuid: styler.get(\"uuid\"),\n        }\n      : undefined\n  }\n\n  get rows(): number {\n    return this.indexTable.length + this.columnsTable.numCols\n  }\n\n  get columns(): number {\n    return this.indexTable.numCols + this.columnsTable.length\n  }\n\n  get headerRows(): number {\n    return this.rows - this.dataRows\n  }\n\n  get headerColumns(): number {\n    return this.columns - this.dataColumns\n  }\n\n  get dataRows(): number {\n    return this.dataTable.length\n  }\n\n  get dataColumns(): number {\n    return this.dataTable.numCols\n  }\n\n  get uuid(): string | undefined {\n    return this.styler && this.styler.uuid\n  }\n\n  get caption(): string | undefined {\n    return this.styler && this.styler.caption\n  }\n\n  get styles(): string | undefined {\n    return this.styler && this.styler.styles\n  }\n\n  get table(): Table {\n    return this.dataTable\n  }\n\n  get index(): Table {\n    return this.indexTable\n  }\n\n  get columnTable(): Table {\n    return this.columnsTable\n  }\n\n  public getCell = (rowIndex: number, columnIndex: number): Cell => {\n    const isBlankCell =\n      rowIndex < this.headerRows && columnIndex < this.headerColumns\n    const isIndexCell =\n      rowIndex >= this.headerRows && columnIndex < this.headerColumns\n    const isColumnsCell =\n      rowIndex < this.headerRows && columnIndex >= this.headerColumns\n\n    if (isBlankCell) {\n      const classNames = [\"blank\"]\n      if (columnIndex > 0) {\n        classNames.push(\"level\" + rowIndex)\n      }\n\n      return {\n        type: \"blank\",\n        classNames: classNames.join(\" \"),\n        content: \"\",\n      }\n    } else if (isColumnsCell) {\n      const dataColumnIndex = columnIndex - this.headerColumns\n      const classNames = [\n        \"col_heading\",\n        \"level\" + rowIndex,\n        \"col\" + dataColumnIndex,\n      ]\n\n      return {\n        type: \"columns\",\n        classNames: classNames.join(\" \"),\n        content: this.getContent(this.columnsTable, dataColumnIndex, rowIndex),\n      }\n    } else if (isIndexCell) {\n      const dataRowIndex = rowIndex - this.headerRows\n      const classNames = [\n        \"row_heading\",\n        \"level\" + columnIndex,\n        \"row\" + dataRowIndex,\n      ]\n\n      return {\n        type: \"index\",\n        id: `T_${this.uuid}level${columnIndex}_row${dataRowIndex}`,\n        classNames: classNames.join(\" \"),\n        content: this.getContent(this.indexTable, dataRowIndex, columnIndex),\n      }\n    } else {\n      const dataRowIndex = rowIndex - this.headerRows\n      const dataColumnIndex = columnIndex - this.headerColumns\n      const classNames = [\n        \"data\",\n        \"row\" + dataRowIndex,\n        \"col\" + dataColumnIndex,\n      ]\n      const content = this.styler\n        ? this.getContent(\n            this.styler.displayValuesTable,\n            dataRowIndex,\n            dataColumnIndex\n          )\n        : this.getContent(this.dataTable, dataRowIndex, dataColumnIndex)\n\n      return {\n        type: \"data\",\n        id: `T_${this.uuid}row${dataRowIndex}_col${dataColumnIndex}`,\n        classNames: classNames.join(\" \"),\n        content,\n      }\n    }\n  }\n\n  public getContent = (\n    table: Table,\n    rowIndex: number,\n    columnIndex: number\n  ): any => {\n    const column = table.getColumnAt(columnIndex)\n    if (column === null) {\n      return \"\"\n    }\n\n    const columnTypeId = this.getColumnTypeId(table, columnIndex)\n    switch (columnTypeId) {\n      case Type.Timestamp: {\n        return this.nanosToDate(column.get(rowIndex))\n      }\n      default: {\n        return column.get(rowIndex)\n      }\n    }\n  }\n\n  /**\n   * Returns apache-arrow specific typeId of column.\n   */\n  private getColumnTypeId(table: Table, columnIndex: number): Type {\n    return table.schema.fields[columnIndex].type.typeId\n  }\n\n  private nanosToDate(nanos: number): Date {\n    return new Date(nanos / 1e6)\n  }\n}\n","import hoistNonReactStatics from \"hoist-non-react-statics\"\nimport React, { ReactNode } from \"react\"\nimport { RenderData, Streamlit } from \"./streamlit\"\n\n/**\n * Props passed to custom Streamlit components.\n */\nexport interface ComponentProps {\n  /** Named dictionary of arguments passed from Python. */\n  args: any\n\n  /** The component's width. */\n  width: number\n\n  /**\n   * True if the component should be disabled.\n   * All components get disabled while the app is being re-run,\n   * and become re-enabled when the re-run has finished.\n   */\n  disabled: boolean\n}\n\n/**\n * Optional Streamlit React-based component base class.\n *\n * You are not required to extend this base class to create a Streamlit\n * component. If you decide not to extend it, you should implement the\n * `componentDidMount` and `componentDidUpdate` functions in your own class,\n * so that your plugin properly resizes.\n */\nexport class StreamlitComponentBase<S = {}> extends React.PureComponent<\n  ComponentProps,\n  S\n  > {\n  public componentDidMount(): void {\n    // After we're rendered for the first time, tell Streamlit that our height\n    // has changed.\n    Streamlit.setFrameHeight()\n  }\n\n  public componentDidUpdate(): void {\n    // After we're updated, tell Streamlit that our height may have changed.\n    Streamlit.setFrameHeight()\n  }\n}\n\n/**\n * Wrapper for React-based Streamlit components.\n *\n * Bootstraps the communication interface between Streamlit and the component.\n */\nexport function withStreamlitConnection(\n  WrappedComponent: React.ComponentType<ComponentProps>\n): React.ComponentType {\n  interface WrapperProps { }\n\n  interface WrapperState {\n    renderData?: RenderData\n    componentError?: Error\n  }\n\n  class ComponentWrapper extends React.PureComponent<\n    WrapperProps,\n    WrapperState\n    > {\n    public constructor(props: WrapperProps) {\n      super(props)\n      this.state = {\n        renderData: undefined,\n        componentError: undefined,\n      }\n    }\n\n    /**\n     * Error boundary function. This will be called if our wrapped\n     * component throws an error. We store the caught error in our state,\n     * and display it in the next render().\n     */\n    public static getDerivedStateFromError = (\n      error: Error\n    ): Partial<WrapperState> => {\n      return { componentError: error }\n    }\n\n    public componentDidMount = (): void => {\n      // Set up event listeners, and signal to Streamlit that we're ready.\n      // We won't render the component until we receive the first RENDER_EVENT.\n      Streamlit.events.addEventListener(\n        Streamlit.RENDER_EVENT,\n        this.onRenderEvent\n      )\n      Streamlit.setComponentReady()\n    }\n\n    public componentDidUpdate = (prevProps: any): void => {\n      // If our child threw an error, we display it in render(). In this\n      // case, the child won't be mounted and therefore won't call\n      // `setFrameHeight` on its own. We do it here so that the rendered\n      // error will be visible.\n      if (this.state.componentError != null) {\n        Streamlit.setFrameHeight()\n      }\n    }\n\n    public componentWillUnmount = (): void => {\n      Streamlit.events.removeEventListener(\n        Streamlit.RENDER_EVENT,\n        this.onRenderEvent\n      )\n    }\n\n    /**\n     * Streamlit is telling this component to redraw.\n     * We save the render data in State, so that it can be passed to the\n     * component in our own render() function.\n     */\n    private onRenderEvent = (event: Event): void => {\n      // Update our state with the newest render data\n      const renderEvent = event as CustomEvent<RenderData>\n      this.setState({ renderData: renderEvent.detail })\n    }\n\n    public render = (): ReactNode => {\n      // If our wrapped component threw an error, display it.\n      if (this.state.componentError != null) {\n        return (\n          <div>\n            <h1>Component Error</h1>\n            <span>{this.state.componentError.message}</span>\n          </div>\n        )\n      }\n\n      // Don't render until we've gotten our first RENDER_EVENT from Streamlit.\n      if (this.state.renderData == null) {\n        return null\n      }\n\n      return (\n        <WrappedComponent\n          width={window.innerWidth}\n          disabled={this.state.renderData.disabled}\n          args={this.state.renderData.args}\n        />\n      )\n    }\n  }\n\n  return hoistNonReactStatics(ComponentWrapper, WrappedComponent)\n}\n","import React, { ReactNode } from \"react\"\nimport {\n  withStreamlitConnection,\n  StreamlitComponentBase,\n  Streamlit,\n} from \"./streamlit\"\nimport { Runtime, Inspector } from \"@observablehq/runtime\";\n\nclass Observable extends StreamlitComponentBase<{}> {\n  public observeValue = {};\n  private notebookRef = React.createRef<HTMLDivElement>();\n  private runtime: any = null;\n  private main: any = null;\n\n  componentWillUnmount() {\n    this.runtime?.dispose();\n  }\n  // @ts-ignore\n  public componentDidUpdate(prevProps: any) {\n    const { args: prevArgs } = prevProps;\n    if (prevArgs.notebook !== this.props.args.notebook) {\n      // TODO handle new notebook\n    }\n    this.redefineCells(this.main, this.props.args.redefine);\n  }\n\n  async embedNotebook(notebook: string, targets: string[], observe: string[], hide:string[]) {\n    if (this.runtime) {\n      this.runtime.dispose();\n    }\n    const targetSet = new Set(targets);\n    const observeSet = new Set(observe);\n    const hideSet = new Set(hide);\n    this.runtime = new Runtime();\n    const { default: define } = await eval(`import(\"https://api.observablehq.com/${notebook}.js?v=3\")`);\n    this.main = this.runtime.module(define, (name: string) => {\n      if (observeSet.has(name) && !targetSet.has(name)) {\n        const observeValue = this.observeValue;\n        return {\n          fulfilled: (value: any) => {\n            //@ts-ignore\n            observeValue[name] = value;\n            //@ts-ignore\n            Streamlit.setComponentValue(observeValue);\n          }\n        }\n      }\n      if (targetSet.size > 0 && !targetSet.has(name)) return;\n      if(hideSet.has(name)) return true;\n      const el = document.createElement('div');\n      this.notebookRef.current?.appendChild(el);\n\n      const i = new Inspector(el);\n      el.addEventListener('input', e => {\n        Streamlit.setFrameHeight();\n      })\n      return {\n        pending() {\n          i.pending();\n          Streamlit.setFrameHeight();\n        },\n        fulfilled(value: any) {\n          i.fulfilled(value);\n          Streamlit.setFrameHeight();\n        },\n        rejected(error: any) {\n          i.rejected(error);\n          Streamlit.setFrameHeight();\n        },\n      };\n    });\n    if (observeSet.size > 0) {\n      Promise.all(Array.from(observeSet).map(async name => [name, await this.main.value(name)])).then(initial => {\n        for (const [name, value] of initial) {\n          // @ts-ignore\n          this.observeValue[name] = value\n        };\n        Streamlit.setComponentValue(this.observeValue);\n      })\n    }\n  }\n\n  redefineCells(main: any, redefine = {}) {\n    for (let cell in redefine) {\n      //@ts-ignore\n      main.redefine(cell, redefine[cell]);\n    }\n  }\n  componentDidMount() {\n    const { notebook, targets = [], observe = [], redefine = {} , hide=[]} = this.props.args;\n    Streamlit.setComponentValue(this.observeValue);\n    this.embedNotebook(notebook, targets, observe, hide).then(() => {\n      this.redefineCells(this.main, redefine);\n    });\n\n  }\n\n  public render = (): ReactNode => {\n    return (\n      <div style={{ border: '1px solid gray', borderRadius: '4px' }}>\n        <div style={{ padding: '9px 12px' }}>\n          <div ref={this.notebookRef}></div>\n        </div>\n        <div style={{ marginTop: '4px' }}>\n          \n          <div style={{\n            backgroundColor: '#ddd',\n            fontWeight: 700,\n            padding: \".25rem .5rem\",\n            borderRadius: '0 0 4px 4px',\n            gridTemplateColumns: \"auto auto\",\n            display:\"grid\"\n          }}>\n            <div style={{textAlign:\"left\"}}>{this.props.args.name}</div>\n            <div style={{textAlign:\"right\"}}>\n            <a href={`https://observablehq.com/${this.props.args.notebook}`} style={{ color: '#666', }}></a>\n            </div>\n          </div>\n        </div>\n      </div >\n    )\n  }\n}\n\nexport default withStreamlitConnection(Observable)\n","import React from \"react\"\nimport ReactDOM from \"react-dom\"\nimport Observable from \"./Observable\"\n\nReactDOM.render(\n  <React.StrictMode>\n    <Observable />\n  </React.StrictMode>,\n  document.getElementById(\"root\")\n)\n"],"sourceRoot":""}

streamlit_observable/frontend/build/static/js/runtime-main.11ec9aca.js

@@ -0,0 +1,2 @@
+!function(e){function t(t){for(var n,l,a=t[0],p=t[1],i=t[2],c=0,s=[];c<a.length;c++)l=a[c],Object.prototype.hasOwnProperty.call(o,l)&&o[l]&&s.push(o[l][0]),o[l]=0;for(n in p)Object.prototype.hasOwnProperty.call(p,n)&&(e[n]=p[n]);for(f&&f(t);s.length;)s.shift()();return u.push.apply(u,i||[]),r()}function r(){for(var e,t=0;t<u.length;t++){for(var r=u[t],n=!0,a=1;a<r.length;a++){var p=r[a];0!==o[p]&&(n=!1)}n&&(u.splice(t--,1),e=l(l.s=r[0]))}return e}var n={},o={1:0},u=[];function l(t){if(n[t])return n[t].exports;var r=n[t]={i:t,l:!1,exports:{}};return e[t].call(r.exports,r,r.exports,l),r.l=!0,r.exports}l.m=e,l.c=n,l.d=function(e,t,r){l.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},l.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},l.t=function(e,t){if(1&t&&(e=l(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(l.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)l.d(r,n,function(t){return e[t]}.bind(null,n));return r},l.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return l.d(t,"a",t),t},l.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},l.p="./";var a=this.webpackJsonpstreamlit_component_template=this.webpackJsonpstreamlit_component_template||[],p=a.push.bind(a);a.push=t,a=a.slice();for(var i=0;i<a.length;i++)t(a[i]);var f=p;r()}([]);
+//# sourceMappingURL=runtime-main.11ec9aca.js.map

streamlit_observable/frontend/build/static/js/runtime-main.11ec9aca.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../webpack/bootstrap"],"names":["webpackJsonpCallback","data","moduleId","chunkId","chunkIds","moreModules","executeModules","i","resolves","length","Object","prototype","hasOwnProperty","call","installedChunks","push","modules","parentJsonpFunction","shift","deferredModules","apply","checkDeferredModules","result","deferredModule","fulfilled","j","depId","splice","__webpack_require__","s","installedModules","1","exports","module","l","m","c","d","name","getter","o","defineProperty","enumerable","get","r","Symbol","toStringTag","value","t","mode","__esModule","ns","create","key","bind","n","object","property","p","jsonpArray","this","oldJsonpFunction","slice"],"mappings":"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","file":"static/js/runtime-main.11ec9aca.js","sourcesContent":[" \t// install a JSONP callback for chunk loading\n \tfunction webpackJsonpCallback(data) {\n \t\tvar chunkIds = data[0];\n \t\tvar moreModules = data[1];\n \t\tvar executeModules = data[2];\n\n \t\t// add \"moreModules\" to the modules object,\n \t\t// then flag all \"chunkIds\" as loaded and fire callback\n \t\tvar moduleId, chunkId, i = 0, resolves = [];\n \t\tfor(;i < chunkIds.length; i++) {\n \t\t\tchunkId = chunkIds[i];\n \t\t\tif(Object.prototype.hasOwnProperty.call(installedChunks, chunkId) && installedChunks[chunkId]) {\n \t\t\t\tresolves.push(installedChunks[chunkId][0]);\n \t\t\t}\n \t\t\tinstalledChunks[chunkId] = 0;\n \t\t}\n \t\tfor(moduleId in moreModules) {\n \t\t\tif(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) {\n \t\t\t\tmodules[moduleId] = moreModules[moduleId];\n \t\t\t}\n \t\t}\n \t\tif(parentJsonpFunction) parentJsonpFunction(data);\n\n \t\twhile(resolves.length) {\n \t\t\tresolves.shift()();\n \t\t}\n\n \t\t// add entry modules from loaded chunk to deferred list\n \t\tdeferredModules.push.apply(deferredModules, executeModules || []);\n\n \t\t// run deferred modules when all chunks ready\n \t\treturn checkDeferredModules();\n \t};\n \tfunction checkDeferredModules() {\n \t\tvar result;\n \t\tfor(var i = 0; i < deferredModules.length; i++) {\n \t\t\tvar deferredModule = deferredModules[i];\n \t\t\tvar fulfilled = true;\n \t\t\tfor(var j = 1; j < deferredModule.length; j++) {\n \t\t\t\tvar depId = deferredModule[j];\n \t\t\t\tif(installedChunks[depId] !== 0) fulfilled = false;\n \t\t\t}\n \t\t\tif(fulfilled) {\n \t\t\t\tdeferredModules.splice(i--, 1);\n \t\t\t\tresult = __webpack_require__(__webpack_require__.s = deferredModule[0]);\n \t\t\t}\n \t\t}\n\n \t\treturn result;\n \t}\n\n \t// The module cache\n \tvar installedModules = {};\n\n \t// object to store loaded and loading chunks\n \t// undefined = chunk not loaded, null = chunk preloaded/prefetched\n \t// Promise = chunk loading, 0 = chunk loaded\n \tvar installedChunks = {\n \t\t1: 0\n \t};\n\n \tvar deferredModules = [];\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, { enumerable: true, get: getter });\n \t\t}\n \t};\n\n \t// define __esModule on exports\n \t__webpack_require__.r = function(exports) {\n \t\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n \t\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n \t\t}\n \t\tObject.defineProperty(exports, '__esModule', { value: true });\n \t};\n\n \t// create a fake namespace object\n \t// mode & 1: value is a module id, require it\n \t// mode & 2: merge all properties of value into the ns\n \t// mode & 4: return value when already ns object\n \t// mode & 8|1: behave like require\n \t__webpack_require__.t = function(value, mode) {\n \t\tif(mode & 1) value = __webpack_require__(value);\n \t\tif(mode & 8) return value;\n \t\tif((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;\n \t\tvar ns = Object.create(null);\n \t\t__webpack_require__.r(ns);\n \t\tObject.defineProperty(ns, 'default', { enumerable: true, value: value });\n \t\tif(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));\n \t\treturn ns;\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"./\";\n\n \tvar jsonpArray = this[\"webpackJsonpstreamlit_component_template\"] = this[\"webpackJsonpstreamlit_component_template\"] || [];\n \tvar oldJsonpFunction = jsonpArray.push.bind(jsonpArray);\n \tjsonpArray.push = webpackJsonpCallback;\n \tjsonpArray = jsonpArray.slice();\n \tfor(var i = 0; i < jsonpArray.length; i++) webpackJsonpCallback(jsonpArray[i]);\n \tvar parentJsonpFunction = oldJsonpFunction;\n\n\n \t// run deferred modules from other chunks\n \tcheckDeferredModules();\n"],"sourceRoot":""}