@vizhub/runtime 0.6.0 → 1.0.0

package/dist/index.js

@@ -1,194 +1,674 @@
-import { g as D } from "./build-DU4cyBtp.js";
-import { b as W, c as x, d as G, a as _, e as A, s as F, v as J } from "./build-DU4cyBtp.js";
-const q = (t) => async (n) => {
-  const i = D();
-  return new Promise((d) => {
-    const l = (u) => {
-      u.data.type === "invalidateVizCacheResponse" && u.data.requestId === i && (t.removeEventListener(
+import { g as L, p as N, t as $ } from "./slugCache-C1nrdh7e.js";
+import { b as de, a as pe, c as fe, d as me, s as ve } from "./slugCache-C1nrdh7e.js";
+import { isVizId as F, getFileText as z, generateVizId as T, fileCollectionToVizFiles as D } from "@vizhub/viz-utils";
+import { transform as V } from "sucrase";
+const W = (e) => async (t) => {
+  const n = L();
+  return new Promise((r) => {
+    const s = (o) => {
+      o.data.type === "invalidateVizCacheResponse" && o.data.requestId === n && (e.removeEventListener(
         "message",
-        l
-      ), d());
+        s
+      ), r());
     };
-    t.addEventListener(
+    e.addEventListener(
       "message",
-      l
-    ), t.postMessage({
+      s
+    ), e.postMessage({
       type: "invalidateVizCacheRequest",
-      changedVizIds: n,
-      requestId: i
+      changedVizIds: t,
+      requestId: n
     });
   });
-}, S = ({
-  worker: t,
-  setBuildErrorMessage: n
+}, P = ({
+  worker: e,
+  setBuildErrorMessage: t
 }) => ({
-  files: i,
-  enableSourcemap: d
+  files: n,
+  enableSourcemap: r,
+  vizId: s
 }) => {
-  const l = D();
+  const o = L();
   return new Promise(
-    (u) => {
-      const s = (m) => {
+    (c) => {
+      const a = (m) => {
         const p = m.data;
-        if (p.type === "buildResponse") {
-          t.removeEventListener(
+        if (p.type === "buildResponse" && p.requestId === o) {
+          e.removeEventListener(
             "message",
-            s
+            a
           );
-          const r = p.buildResult, f = p.error;
-          f ? n == null || n(f) : n == null || n(null), u(r);
+          const g = p.buildResult, v = p.error;
+          v ? t == null || t(v) : t == null || t(null), c(g);
         }
       };
-      t.addEventListener("message", s);
-      const c = {
+      e.addEventListener("message", a);
+      const u = {
         type: "buildRequest",
-        files: i,
-        enableSourcemap: d,
-        requestId: l
+        files: n,
+        enableSourcemap: r,
+        requestId: o,
+        vizId: s
       };
-      t.postMessage(c);
+      e.postMessage(u);
     }
   );
-}, E = "IDLE", I = "ENQUEUED", L = "PENDING_CLEAN", R = "PENDING_DIRTY", z = ({
-  iframe: t,
-  worker: n,
-  setBuildErrorMessage: i,
-  getLatestContent: d,
-  resolveSlugKey: l,
-  writeFile: u
+}, S = "IDLE", b = "ENQUEUED", R = "PENDING_CLEAN", x = "PENDING_DIRTY", oe = ({
+  iframe: e,
+  worker: t,
+  setBuildErrorMessage: n,
+  getLatestContent: r,
+  resolveSlugKey: s,
+  writeFile: o
 }) => {
-  let s = E, c = null;
-  const m = S({
-    worker: n,
-    setBuildErrorMessage: i
-  }), p = ({
-    data: o
+  let c = S, a = null;
+  const u = P({
+    worker: t,
+    setBuildErrorMessage: n
+  }), m = ({
+    data: l
   }) => {
-    if (o.type === "contentRequest" && d) {
-      const { vizId: e } = o;
-      d(e).then((a) => {
-        n.postMessage({
+    if (l.type === "contentRequest" && r) {
+      const { vizId: i } = l;
+      r(i).then((d) => {
+        t.postMessage({
           type: "contentResponse",
-          vizId: e,
-          content: a
+          vizId: i,
+          content: d
         });
       });
-    } else if (o.type === "resolveSlugRequest" && l) {
-      const { slugKey: e, requestId: a } = o;
-      l(e).then((v) => {
-        n.postMessage({
+    } else if (l.type === "resolveSlugRequest") {
+      const { slugKey: i, requestId: d } = l;
+      if (s)
+        s(i).then(
+          (f) => {
+            const h = {
+              type: "resolveSlugResponse",
+              vizId: f,
+              requestId: d
+            };
+            t.postMessage(h);
+          }
+        );
+      else {
+        const f = {
           type: "resolveSlugResponse",
-          slugKey: e,
-          vizId: v,
-          requestId: a
-        });
-      });
+          vizId: null,
+          requestId: d
+        };
+        t.postMessage(f);
+      }
     }
   };
-  n.addEventListener("message", p);
-  const r = (o) => {
-    const e = o.data;
-    (e.type === "runDone" || e.type === "runError") && e.type === "runError" && i && i(e.error.message), e.type === "writeFile" && u && e.fileName && e.content && u(e.fileName, e.content);
+  t.addEventListener("message", m);
+  const p = (l) => {
+    const i = l.data;
+    (i.type === "runDone" || i.type === "runError") && i.type === "runError" && n && n(i.error.message), i.type === "writeFile" && o && i.fileName && i.content && o(i.fileName, i.content);
   };
-  window.addEventListener("message", r);
-  const f = () => {
-    n.removeEventListener("message", p), window.removeEventListener("message", r);
-  }, w = async ({
-    files: o,
-    enableHotReloading: e = !1,
-    enableSourcemap: a = !1
+  window.addEventListener("message", p);
+  const g = () => {
+    t.removeEventListener("message", m), window.removeEventListener("message", p);
+  }, v = async ({
+    files: l,
+    enableHotReloading: i = !1,
+    enableSourcemap: d = !1,
+    vizId: f
   }) => {
-    s = L;
-    const v = await m({
-      files: o,
-      enableSourcemap: a
+    c = R;
+    const h = await u({
+      files: l,
+      enableSourcemap: d,
+      vizId: f
     });
-    if (!v)
-      return;
-    const { html: C, js: y, css: N } = v;
-    if (console.clear(), e) {
-      if (N) {
-        const h = {
-          type: "runCSS",
-          css: N
-        };
-        if (!t.contentWindow)
-          throw new Error(
-            "iframe.contentWindow is null - this should never happen"
+    if (h) {
+      const { html: w, js: y, css: j } = h;
+      if (console.clear(), i) {
+        if (j) {
+          const I = {
+            type: "runCSS",
+            css: j
+          };
+          if (!e.contentWindow)
+            throw new Error(
+              "iframe.contentWindow is null - this should never happen"
+            );
+          e.contentWindow.postMessage(
+            I,
+            window.location.origin
           );
-        t.contentWindow.postMessage(
-          h,
-          window.location.origin
-        );
-      }
-      if (y) {
-        const h = {
-          type: "runJS",
-          js: y
-        };
-        if (!t.contentWindow)
-          throw new Error(
-            "iframe.contentWindow is null - this should never happen"
+        }
+        if (y) {
+          const I = {
+            type: "runJS",
+            js: y
+          };
+          if (!e.contentWindow)
+            throw new Error(
+              "iframe.contentWindow is null - this should never happen"
+            );
+          e.contentWindow.postMessage(
+            I,
+            window.location.origin
           );
-        t.contentWindow.postMessage(
-          h,
-          window.location.origin
-        );
-      }
-    } else
-      t.srcdoc = C || "";
-    s === R ? (requestAnimationFrame(() => {
-      if (!c)
+        }
+      } else
+        e.srcdoc = w || "";
+    }
+    c === x ? (requestAnimationFrame(() => {
+      if (!a)
         throw new Error(
           "latestFiles is not defined and state is PENDING_DIRTY - this should never happen"
         );
-      w({
-        files: c,
-        enableHotReloading: e,
-        enableSourcemap: a
+      v({
+        files: a,
+        enableHotReloading: i,
+        enableSourcemap: d,
+        vizId: f
       });
-    }), s = I) : s = E;
-  }, g = ({
-    files: o,
-    enableHotReloading: e = !1,
-    enableSourcemap: a = !1
+    }), c = b) : c = S;
+  }, E = ({
+    files: l,
+    enableHotReloading: i = !1,
+    enableSourcemap: d = !1,
+    vizId: f = void 0
   }) => {
-    if (c = null, s === E)
-      s = I, w({
-        files: o,
-        enableHotReloading: e,
-        enableSourcemap: a
+    if (a = null, c === S)
+      c = b, v({
+        files: l,
+        enableHotReloading: i,
+        enableSourcemap: d,
+        vizId: f
       });
-    else if (s === L)
-      c = o, s = R;
-    else if (s === R)
-      c = o;
-    else if (s === I)
-      c = o;
+    else if (c === R)
+      a = l, c = x;
+    else if (c === x)
+      a = l;
+    else if (c === b)
+      a = l;
     else
-      throw new Error(`Unexpected state: ${s}`);
+      throw new Error(`Unexpected state: ${c}`);
   };
   return {
-    invalidateVizCache: q(n),
-    run: g,
-    cleanup: f
+    invalidateVizCache: W(t),
+    run: E,
+    cleanup: g
   };
-}, P = ({
-  rawMessage: t,
-  vizId: n
+};
+function A(e = {}) {
+  return {
+    name: "sucrase",
+    transform(t, n) {
+      if (!n.match(/\.(?:js|[jt]sx)$/))
+        return null;
+      const r = V(t, {
+        transforms: ["jsx", "typescript"],
+        // For source maps
+        filePath: n,
+        sourceMapOptions: {
+          compiledFilename: "bundle.js"
+        },
+        production: !0,
+        ...e
+      });
+      return {
+        code: r.code,
+        map: r.sourceMap
+      };
+    }
+  };
+}
+const O = {
+  dependencies: {},
+  vizhub: {},
+  license: "MIT"
+}, U = !1, C = (e) => {
+  const t = e["package.json"];
+  try {
+    const n = t ? JSON.parse(t) : O;
+    return U && console.log(
+      "[packageJSON] pkg:",
+      JSON.stringify(n, null, 2)
+    ), n;
+  } catch {
+    return O;
+  }
+}, J = (e) => C(e).dependencies || {}, q = (e) => (C(e).vizhub || {}).libraries || {}, G = ({ name: e, version: t }, n, r = "jsdelivr") => {
+  const s = n[e] && n[e].path || "";
+  return r === "jsdelivr" ? `https://cdn.jsdelivr.net/npm/${e}@${t}${s}` : `https://unpkg.com/${e}@${t}${s}`;
+}, k = (e) => {
+  var n;
+  const t = (n = e == null ? void 0 : e.vizhub) == null ? void 0 : n.libraries;
+  return t ? Object.entries(t).reduce(
+    (r, [s, o]) => (o.global && (r[s] = o.global), r),
+    {}
+  ) : {};
+}, _ = {
+  d3: "d3",
+  react: "React",
+  "react-dom": "ReactDOM"
+}, M = (e) => {
+  const t = k(e);
+  return {
+    ..._,
+    ...t
+  };
+}, Q = `var EOL = {},
+  EOF = {},
+  QUOTE = 34,
+  NEWLINE = 10,
+  RETURN = 13;
+
+function objectConverter(columns) {
+  return new Function(
+    'd',
+    'return {' +
+      columns
+        .map(function (name, i) {
+          return (
+            JSON.stringify(name) + ': d[' + i + '] || ""'
+          );
+        })
+        .join(',') +
+      '}',
+  );
+}
+
+function customConverter(columns, f) {
+  var object = objectConverter(columns);
+  return function (row, i) {
+    return f(object(row), i, columns);
+  };
+}
+
+function dsv(delimiter) {
+  var DELIMITER = delimiter.charCodeAt(0);
+
+  function parse(text, f) {
+    var convert,
+      columns,
+      rows = parseRows(text, function (row, i) {
+        if (convert) return convert(row, i - 1);
+        (columns = row),
+          (convert = f
+            ? customConverter(row, f)
+            : objectConverter(row));
+      });
+    rows.columns = columns || [];
+    return rows;
+  }
+
+  function parseRows(text, f) {
+    var rows = [], // output rows
+      N = text.length,
+      I = 0, // current character index
+      n = 0, // current line number
+      t, // current token
+      eof = N <= 0, // current token followed by EOF?
+      eol = false; // current token followed by EOL?
+
+    // Strip the trailing newline.
+    if (text.charCodeAt(N - 1) === NEWLINE) --N;
+    if (text.charCodeAt(N - 1) === RETURN) --N;
+
+    function token() {
+      if (eof) return EOF;
+      if (eol) return (eol = false), EOL;
+
+      // Unescape quotes.
+      var i,
+        j = I,
+        c;
+      if (text.charCodeAt(j) === QUOTE) {
+        while (
+          (I++ < N && text.charCodeAt(I) !== QUOTE) ||
+          text.charCodeAt(++I) === QUOTE
+        );
+        if ((i = I) >= N) eof = true;
+        else if ((c = text.charCodeAt(I++)) === NEWLINE)
+          eol = true;
+        else if (c === RETURN) {
+          eol = true;
+          if (text.charCodeAt(I) === NEWLINE) ++I;
+        }
+        return text.slice(j + 1, i - 1).replace(/""/g, '"');
+      }
+
+      // Find next delimiter or newline.
+      while (I < N) {
+        if ((c = text.charCodeAt((i = I++))) === NEWLINE)
+          eol = true;
+        else if (c === RETURN) {
+          eol = true;
+          if (text.charCodeAt(I) === NEWLINE) ++I;
+        } else if (c !== DELIMITER) continue;
+        return text.slice(j, i);
+      }
+
+      // Return last token before EOF.
+      return (eof = true), text.slice(j, N);
+    }
+
+    while ((t = token()) !== EOF) {
+      var row = [];
+      while (t !== EOL && t !== EOF)
+        row.push(t), (t = token());
+      if (f && (row = f(row, n++)) == null) continue;
+      rows.push(row);
+    }
+
+    return rows;
+  }
+
+  return {
+    parse: parse,
+  };
+}
+
+var csv = dsv(',');
+
+var csvParse = csv.parse;
+
+var tsv = dsv('	');
+
+var tsvParse = tsv.parse;
+
+export { csvParse, tsvParse };`, Y = (e) => (
+  // str.replace(/`/g, '\\`');
+  e.replace(/\\/g, "\\\\").replace(/`/g, "\\`")
+), Z = () => ({
+  name: "transformDSV",
+  // `id` here is of the form
+  // `{vizId}/{fileName}`
+  transform: async (e, t) => {
+    const { fileName: n } = N(t), r = n.endsWith(".csv"), s = n.endsWith(".tsv");
+    if (r || s)
+      return {
+        code: `
+            ${Q}
+            const data = ${r ? "csvParse" : "tsvParse"}(\`${Y(e)}\`);
+            export default data;
+          `,
+        map: { mappings: "" }
+      };
+  }
+}), K = (e) => {
+  const t = /^@([a-zA-Z0-9_-]+)\/([a-zA-Z0-9_-]+)$/, n = e.match(t);
+  return n ? {
+    userName: n[1],
+    idOrSlug: n[2]
+  } : null;
+}, X = ({
+  vizId: e,
+  slugCache: t
+}) => ({
+  name: "vizResolve",
+  resolveId: async (n, r) => {
+    if (n.startsWith("./") && !(r != null && r.startsWith("https://"))) {
+      let o = n.substring(2);
+      if (!o.endsWith(".js") && !o.endsWith(".css") && !o.endsWith(".csv") && !o.endsWith(".svelte") && (o += ".js"), r) {
+        const {
+          vizId: c,
+          fileName: a
+        } = N(r), u = a.split("/").slice(0, -1).join("/"), m = u ? `${u}/${o}` : o;
+        return `${c}/${m}`;
+      }
+      return e + "/" + o;
+    }
+    const s = K(n);
+    if (s) {
+      let o;
+      if (F(s.idOrSlug))
+        o = s.idOrSlug;
+      else {
+        if (!t)
+          throw new Error(
+            "slugCache is required to import by slug in v3 runtime"
+          );
+        o = await t.get(
+          `${s.userName}/${s.idOrSlug}`
+        );
+      }
+      return o + "/index.js";
+    }
+  }
+}), H = ({
+  vizCache: e,
+  trackCSSImport: t,
+  vizId: n,
+  files: r
+}) => ({
+  name: "vizLoad",
+  // `id` here is of the form
+  // `{vizId}/{fileName}`
+  load: async (s) => {
+    const o = N(s), c = o.vizId, a = o.fileName;
+    if (a.endsWith(".css"))
+      return t(s), "";
+    let u = null;
+    if (c === n && r)
+      u = r[a] || null;
+    else {
+      const m = await e.get(c);
+      u = z(m, a);
+    }
+    if (u === null)
+      throw new Error(
+        `Imported file "${a}" not found.`
+      );
+    return u;
+  }
+}), B = async ({
+  files: e,
+  rollup: t,
+  enableSourcemap: n = !0,
+  vizCache: r,
+  vizId: s,
+  slugCache: o,
+  getSvelteCompiler: c
 }) => {
-  const i = new RegExp(n, "g");
-  return t == null ? void 0 : t.replace(i, ".");
+  const a = /* @__PURE__ */ new Set(), u = (i) => {
+    a.add(i);
+  };
+  if (!e["index.js"])
+    throw new Error("Missing index.js");
+  const p = {
+    input: "./index.js",
+    plugins: [
+      ...s ? [X({ vizId: s, slugCache: o })] : [],
+      Z(),
+      A(),
+      $({ getSvelteCompiler: c }),
+      ...r ? [
+        H({
+          vizCache: r,
+          trackCSSImport: u,
+          vizId: s,
+          files: e
+        })
+      ] : []
+    ],
+    onwarn(i, d) {
+      i.code !== "UNRESOLVED_IMPORT" && d(i);
+    }
+  }, g = {
+    format: "umd",
+    name: "Viz",
+    sourcemap: !!n,
+    compact: !0
+  }, v = C(e);
+  if (v) {
+    const i = M(v);
+    i && (p.external = Object.keys(i), g.globals = i);
+  }
+  const E = await t(p), { output: l } = await E.generate(g);
+  return {
+    src: l[0].code,
+    cssFiles: Array.from(a)
+  };
 };
+function ee() {
+  return Math.random().toString().slice(2, 7);
+}
+const te = ({
+  cdn: e,
+  src: t,
+  styles: n
+}) => {
+  const s = `viz-container-${ee()}`;
+  return `<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">${e}${n}
+  <style>
+    body {
+      margin: 0;
+      overflow: hidden;
+    }
+    #${s} {
+      height: 100vh;
+    }
+  </style>
+</head>
+<body>
+  <div id="${s}"></div>
+  <script id="injected-script">${t}<\/script>
+  <script>
+    (() => {
+      let cleanup;
+      const render = () => {
+        const container = document.getElementById('${s}');
+        typeof cleanup === 'function' && cleanup();
+        cleanup = Viz.main(container, { state: window.state, setState, writeFile });
+      };
+      const setState = (next) => {
+        window.state = next(window.state);
+        render();
+      };
+      const writeFile = (fileName, content) => {
+        parent.postMessage({ type: 'writeFile', fileName, content }, "*");
+      };
+      const run = () => {
+        try {
+          setState((state) => state || {});
+        } catch (error) {
+          console.error(error);
+          parent.postMessage({ type: 'runError', error }, "*");
+        }
+      }
+      run();
+      const runJS = (src) => {
+        document.getElementById('injected-script')?.remove();
+        const script = document.createElement('script');
+        script.textContent = src;
+        script.id = 'injected-script';
+        document.body.appendChild(script);
+        run();
+      };
+      const runCSS = (css) => {
+        let style = document.getElementById('injected-style');
+        if (!style) {
+          style = document.createElement('style');
+          style.type = 'text/css';
+          style.id = 'injected-style';
+          document.head.appendChild(style);
+        }
+        style.textContent = css;
+      };
+      onmessage = (message) => {
+        switch (message.data.type) {
+          case 'runJS':
+            runJS(message.data.js);
+            parent.postMessage({ type: 'runDone' }, "*");
+            break;
+          case 'runCSS':
+            runCSS(message.data.css);
+            break;
+          case 'ping':
+            parent.postMessage({ type: 'pong' }, "*");
+            break;
+          default:
+            break;
+        }
+      }
+    })();
+  <\/script>
+</body>
+</html>`;
+}, ie = async ({
+  files: e,
+  rollup: t,
+  enableSourcemap: n = !0,
+  vizCache: r,
+  vizId: s,
+  slugCache: o,
+  getSvelteCompiler: c
+}) => {
+  const { src: a, cssFiles: u } = await B({
+    files: e,
+    rollup: t,
+    enableSourcemap: n,
+    vizCache: r,
+    vizId: s,
+    slugCache: o,
+    getSvelteCompiler: c
+  });
+  let m = [];
+  if (u.length > 0)
+    for (let l = 0; l < u.length; l++) {
+      const i = u[l], d = N(i), f = d.vizId, h = d.fileName;
+      let w = null;
+      if (f === s && e)
+        w = e[h] || null;
+      else {
+        const y = await r.get(f);
+        w = z(y, h);
+      }
+      w && m.push(w);
+    }
+  const p = m.join(`
+`), g = `
+    <style id="injected-style">${p}</style>`;
+  let v = "";
+  const E = Object.entries(
+    J(e)
+  );
+  if (E.length > 0) {
+    const l = q(e);
+    v = E.map(([i, d], f) => {
+      const h = G(
+        { name: i, version: d },
+        l
+      );
+      return `${f > 0 ? "    " : `
+    `}<script src="${h}"><\/script>`;
+    }).join("");
+  }
+  return {
+    html: te({ cdn: v, src: a, styles: g }),
+    css: p,
+    js: a
+  };
+}, ce = ({
+  rawMessage: e,
+  vizId: t
+}) => {
+  const n = new RegExp(t, "g");
+  return e == null ? void 0 : e.replace(n, ".");
+}, ae = (e, t = "Sample Content for Exporting", n = T()) => ({
+  id: n,
+  files: D(e),
+  title: t
+});
 export {
-  W as build,
-  P as cleanRollupErrorMessage,
-  x as computeBundleJSV3,
-  z as createRuntime,
-  G as createSlugCache,
-  _ as createVizCache,
-  A as createVizContent,
-  F as svelteCompilerUrl,
-  J as v3Build
+  de as build,
+  ce as cleanRollupErrorMessage,
+  B as computeBundleJSV3,
+  oe as createRuntime,
+  pe as createSlugCache,
+  fe as createVizCache,
+  ae as createVizContent,
+  me as determineRuntimeVersion,
+  ve as svelteCompilerUrl,
+  ie as v3Build
 };
 //# sourceMappingURL=index.js.map