@dxos/plugin-script 0.6.12 → 0.6.13-main.041e8aa

package/dist/lib/node/types/index.cjs

@@ -18,13 +18,13 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var types_exports = {};
 __export(types_exports, {
-  FunctionType: () => import_chunk_5RBVXKXT.FunctionType,
-  ScriptAction: () => import_chunk_5RBVXKXT.ScriptAction,
-  ScriptType: () => import_chunk_5RBVXKXT.ScriptType
+  FunctionType: () => import_chunk_25PQE7FL.FunctionType,
+  ScriptAction: () => import_chunk_25PQE7FL.ScriptAction,
+  ScriptType: () => import_chunk_25PQE7FL.ScriptType
 });
 module.exports = __toCommonJS(types_exports);
-var import_chunk_5RBVXKXT = require("../chunk-5RBVXKXT.cjs");
-var import_chunk_4VMNBXWU = require("../chunk-4VMNBXWU.cjs");
+var import_chunk_25PQE7FL = require("../chunk-25PQE7FL.cjs");
+var import_chunk_EJC55SDD = require("../chunk-EJC55SDD.cjs");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   FunctionType,

package/dist/lib/node/types/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["index.cjs"],
-  "sourcesContent": ["import {\n  FunctionType,\n  ScriptAction,\n  ScriptType\n} from \"../chunk-5RBVXKXT.cjs\";\nimport \"../chunk-4VMNBXWU.cjs\";\nexport {\n  FunctionType,\n  ScriptAction,\n  ScriptType\n};\n//# sourceMappingURL=index.cjs.map\n"],
+  "sourcesContent": ["import {\n  FunctionType,\n  ScriptAction,\n  ScriptType\n} from \"../chunk-25PQE7FL.cjs\";\nimport \"../chunk-EJC55SDD.cjs\";\nexport {\n  FunctionType,\n  ScriptAction,\n  ScriptType\n};\n//# sourceMappingURL=index.cjs.map\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,4BAIO;AACP,4BAAO;",
   "names": []
 }

package/dist/lib/node-esm/ScriptContainer-EAE6L5JV.mjs

@@ -0,0 +1,666 @@
+import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
+import {
+  USERFUNCTIONS_PRESET_META_KEY,
+  getUserFunctionUrlInMetadata,
+  publicKeyToDid,
+  setUserFunctionUrlInMetadata,
+  uploadWorkerFunction
+} from "./chunk-2NX3HWPM.mjs";
+import {
+  Bundler,
+  templates
+} from "./chunk-LDLNTVAK.mjs";
+import {
+  FunctionType
+} from "./chunk-7EDYDVQH.mjs";
+import {
+  SCRIPT_PLUGIN
+} from "./chunk-GO7HYFM5.mjs";
+
+// packages/plugins/experimental/plugin-script/src/components/ScriptContainer.tsx
+import React5 from "react";
+import { fullyQualifiedId } from "@dxos/react-client/echo";
+import { useAttendableAttributes } from "@dxos/react-ui-attention";
+import { mx as mx3 } from "@dxos/react-ui-theme";
+
+// packages/plugins/experimental/plugin-script/src/components/ScriptEditor.tsx
+import { format } from "prettier";
+import prettierPluginEstree from "prettier/plugins/estree";
+import prettierPluginTypescript from "prettier/plugins/typescript";
+import React4, { useCallback, useMemo, useState as useState3 } from "react";
+import { log as log2 } from "@dxos/log";
+import { useClient } from "@dxos/react-client";
+import { create, createDocAccessor, Filter, getMeta, getSpace, useQuery } from "@dxos/react-client/echo";
+import { useIdentity } from "@dxos/react-client/halo";
+import { useTranslation as useTranslation3 } from "@dxos/react-ui";
+import { createDataExtensions, listener } from "@dxos/react-ui-editor";
+import { mx as mx2 } from "@dxos/react-ui-theme";
+
+// packages/plugins/experimental/plugin-script/src/components/DebugPanel/DebugPanel.tsx
+import React, { useEffect, useRef, useState } from "react";
+import { log } from "@dxos/log";
+import { Avatar, DensityProvider, Icon, Input, Toolbar, useControlledValue, useTranslation } from "@dxos/react-ui";
+import { SyntaxHighlighter } from "@dxos/react-ui-syntax-highlighter";
+import { mx } from "@dxos/react-ui-theme";
+var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/experimental/plugin-script/src/components/DebugPanel/DebugPanel.tsx";
+var DebugPanel = ({ classNames, functionUrl, binding: _binding, onBindingChange }) => {
+  const { t } = useTranslation(SCRIPT_PLUGIN);
+  const bindingInputRef = useRef(null);
+  const [binding, setBinding] = useControlledValue(_binding ?? "");
+  const handleBlur = () => {
+    onBindingChange?.(binding);
+  };
+  const inputRef = useRef(null);
+  const [input, setInput] = useState("");
+  const [result, setResult] = useState("");
+  const [state, setState] = useState(null);
+  const [history, setHistory] = useState([]);
+  const scrollerRef = useRef(null);
+  const handleScroll = () => {
+    if (scrollerRef.current) {
+      scrollerRef.current.scrollTop = scrollerRef.current.scrollHeight;
+    }
+  };
+  const controller = useRef();
+  useEffect(() => {
+    return () => {
+      handleStop();
+    };
+  }, []);
+  const handleStop = () => {
+    controller.current?.abort("stop");
+    controller.current = void 0;
+  };
+  const handleClear = () => {
+    handleStop();
+    setInput("");
+    setResult("");
+    setHistory([]);
+    inputRef.current?.focus();
+  };
+  const handleResponse = ({ text, data, error } = {}) => {
+    controller.current = void 0;
+    setHistory((history2) => [
+      ...history2,
+      {
+        type: "response",
+        text,
+        data,
+        error
+      }
+    ]);
+    setResult("");
+    setState(null);
+    handleScroll();
+  };
+  const handleRequest = async (input2) => {
+    try {
+      setState("pending");
+      let data = null;
+      if (input2.charAt(0) === "{") {
+        try {
+          const validJsonString = input2.replace(/'/g, '"').replace(/([{,]\s*)([a-zA-Z0-9_]+)(\s*:)/g, '$1"$2"$3');
+          data = JSON.parse(validJsonString);
+          input2 = JSON.stringify(data, null, 2);
+        } catch (err) {
+          inputRef.current?.focus();
+          return;
+        }
+      }
+      setInput("");
+      setResult("");
+      setHistory((history2) => [
+        ...history2,
+        {
+          type: "request",
+          text: input2
+        }
+      ]);
+      setTimeout(() => {
+        handleScroll();
+      });
+      controller.current = new AbortController();
+      const response = await fetch(functionUrl, {
+        signal: controller.current.signal,
+        method: "POST",
+        body: input2,
+        headers: {
+          "Content-Type": data ? "application/json" : "text/plain"
+        }
+      });
+      if (!response.ok) {
+        const text2 = await response.text();
+        handleResponse({
+          error: new Error(text2 || response.statusText || String(response.status))
+        });
+        return;
+      }
+      const contentType = response.headers.get("content-type");
+      if (contentType === "application/json") {
+        const data2 = await response.json();
+        handleResponse({
+          data: data2
+        });
+        return;
+      }
+      setState("responding");
+      let text = "";
+      const reader = response.body.getReader();
+      const pump = async ({ done, value }) => {
+        text = text + new TextDecoder().decode(value);
+        if (!controller.current || done) {
+          handleResponse({
+            text
+          });
+          return;
+        }
+        setResult(text);
+        setTimeout(() => {
+          handleScroll();
+        });
+        return reader.read().then(pump);
+      };
+      void reader.read().then(pump).catch((err) => {
+        if (err.name !== "AbortError") {
+          log.catch(err, void 0, {
+            F: __dxlog_file,
+            L: 163,
+            S: void 0,
+            C: (f, a) => f(...a)
+          });
+        }
+      });
+    } catch (err) {
+      if (err !== "stop") {
+        const error = err instanceof Error ? err : new Error(err);
+        handleResponse({
+          error
+        });
+        log.catch(err, void 0, {
+          F: __dxlog_file,
+          L: 170,
+          S: void 0,
+          C: (f, a) => f(...a)
+        });
+      } else {
+        handleResponse();
+      }
+    }
+  };
+  return /* @__PURE__ */ React.createElement(DensityProvider, {
+    density: "fine"
+  }, /* @__PURE__ */ React.createElement("div", {
+    className: mx("flex flex-col h-full overflow-hidden", classNames)
+  }, /* @__PURE__ */ React.createElement("div", {
+    ref: scrollerRef,
+    className: "flex flex-col gap-6 h-full p-4 overflow-x-hidden overflow-y-auto"
+  }, /* @__PURE__ */ React.createElement(MessageThread, {
+    state,
+    result,
+    history
+  })), /* @__PURE__ */ React.createElement(Toolbar.Root, {
+    classNames: "p-2"
+  }, /* @__PURE__ */ React.createElement(Input.Root, null, /* @__PURE__ */ React.createElement(Input.TextInput, {
+    ref: inputRef,
+    autoFocus: true,
+    placeholder: t("function request placeholder"),
+    value: input,
+    onChange: (ev) => setInput(ev.target.value),
+    onKeyDown: (ev) => ev.key === "Enter" && handleRequest(input)
+  })), /* @__PURE__ */ React.createElement(Input.Root, null, /* @__PURE__ */ React.createElement(Input.TextInput, {
+    ref: bindingInputRef,
+    classNames: "!w-[10rem]",
+    placeholder: t("binding placeholder"),
+    value: binding,
+    onChange: (ev) => setBinding(ev.target.value.toUpperCase()),
+    onBlur: handleBlur
+  })), /* @__PURE__ */ React.createElement(Toolbar.Button, {
+    onClick: () => handleRequest(input)
+  }, /* @__PURE__ */ React.createElement(Icon, {
+    icon: "ph--play--regular",
+    size: 4
+  })), /* @__PURE__ */ React.createElement(Toolbar.Button, {
+    onClick: () => state ? handleStop() : handleClear()
+  }, /* @__PURE__ */ React.createElement(Icon, {
+    icon: state ? "ph--stop--regular" : "ph--trash--regular",
+    size: 4
+  })))));
+};
+var MessageThread = ({ state, result, history }) => {
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, history.map((message, i) => /* @__PURE__ */ React.createElement("div", {
+    key: i,
+    className: "grid grid-cols-[3rem_1fr_3rem]"
+  }, /* @__PURE__ */ React.createElement("div", {
+    className: "p-1"
+  }, message.type === "response" && /* @__PURE__ */ React.createElement(RobotAvatar, null)), /* @__PURE__ */ React.createElement("div", {
+    className: "overflow-auto"
+  }, /* @__PURE__ */ React.createElement(MessageItem, {
+    message
+  })))), result?.length > 0 && /* @__PURE__ */ React.createElement("div", {
+    className: "grid grid-cols-[3rem_1fr_3rem]"
+  }, /* @__PURE__ */ React.createElement("div", {
+    className: "p-1"
+  }, state === "pending" && /* @__PURE__ */ React.createElement(Icon, {
+    icon: "ph--spinner--regular",
+    size: 6,
+    classNames: "animate-spin"
+  }) || /* @__PURE__ */ React.createElement(Icon, {
+    icon: "ph--robot--regular",
+    size: 6,
+    classNames: "animate-[pulse_1s_ease-in-out_infinite]"
+  })), /* @__PURE__ */ React.createElement("div", {
+    className: "overflow-auto"
+  }, /* @__PURE__ */ React.createElement(MessageItem, {
+    message: {
+      type: "response",
+      text: result
+    }
+  }))));
+};
+var MessageItem = ({ classNames, message }) => {
+  const { type, text, data, error } = message;
+  const wrapper = "p-1 px-2 rounded-lg bg-hoverSurface overflow-auto";
+  return /* @__PURE__ */ React.createElement("div", {
+    className: mx("flex", type === "request" ? "ml-[8rem] justify-end" : "mr-[8rem]", classNames)
+  }, error && /* @__PURE__ */ React.createElement("div", {
+    className: mx(wrapper, "whitespace-pre text-error")
+  }, String(error)), text !== void 0 && /* @__PURE__ */ React.createElement("div", {
+    className: mx(wrapper, type === "request" && "bg-primary-400 dark:bg-primary-600")
+  }, text || "\xD8"), data && /* @__PURE__ */ React.createElement(SyntaxHighlighter, {
+    language: "json",
+    className: mx(wrapper, "px-8 py-2 text-xs")
+  }, JSON.stringify(data, null, 2)));
+};
+var RobotAvatar = () => /* @__PURE__ */ React.createElement(Avatar.Root, {
+  size: 6,
+  variant: "circle"
+}, /* @__PURE__ */ React.createElement(Avatar.Frame, null, /* @__PURE__ */ React.createElement(Avatar.Icon, {
+  icon: "ph--robot--regular"
+})));
+
+// packages/plugins/experimental/plugin-script/src/components/Toolbar/Toolbar.tsx
+import React2, { useState as useState2 } from "react";
+import { DensityProvider as DensityProvider2, ElevationProvider, Icon as Icon2, Select, ToggleGroup, ToggleGroupItem, Toolbar as NaturalToolbar, Tooltip, useTranslation as useTranslation2 } from "@dxos/react-ui";
+var Toolbar2 = ({ classNames, deployed, error, functionUrl, view, templates: templates2, onDeploy, onFormat, onViewChange, onTemplateSelect }) => {
+  const { t } = useTranslation2(SCRIPT_PLUGIN);
+  const [pending, setPending] = useState2(false);
+  const handleCopyLink = async () => {
+    if (!functionUrl) {
+      return;
+    }
+    await navigator.clipboard.writeText(functionUrl);
+  };
+  const handleDeploy = async () => {
+    if (!pending) {
+      setPending(true);
+      await onDeploy?.();
+      setPending(false);
+    }
+  };
+  return /* @__PURE__ */ React2.createElement(DensityProvider2, {
+    density: "fine"
+  }, /* @__PURE__ */ React2.createElement(ElevationProvider, {
+    elevation: "chrome"
+  }, /* @__PURE__ */ React2.createElement(NaturalToolbar.Root, {
+    classNames: [
+      "p-1",
+      classNames
+    ],
+    style: {
+      contain: "layout"
+    }
+  }, templates2 && /* @__PURE__ */ React2.createElement(TemplateSelect, {
+    templates: templates2,
+    onTemplateSelect
+  }), onFormat && /* @__PURE__ */ React2.createElement(ToolbarIconButton, {
+    icon: "ph--magic-wand--regular",
+    text: t("format label"),
+    onClick: onFormat
+  }), /* @__PURE__ */ React2.createElement("div", {
+    role: "separator",
+    className: "grow"
+  }), error ? /* @__PURE__ */ React2.createElement(Tooltip.Root, null, /* @__PURE__ */ React2.createElement(Tooltip.Trigger, null, /* @__PURE__ */ React2.createElement(Icon2, {
+    icon: "ph--warning-circle--regular",
+    size: 4
+  })), /* @__PURE__ */ React2.createElement(Tooltip.Portal, null, /* @__PURE__ */ React2.createElement(Tooltip.Content, null, /* @__PURE__ */ React2.createElement(Tooltip.Arrow, null), error))) : null, functionUrl && deployed && /* @__PURE__ */ React2.createElement(ToolbarIconButton, {
+    icon: "ph--link--regular",
+    text: t("copy link label"),
+    onClick: handleCopyLink
+  }), onDeploy && /* @__PURE__ */ React2.createElement(ToolbarIconButton, {
+    icon: pending ? "ph--spinner-gap--regular" : "ph--cloud-arrow-up--regular",
+    classNames: [
+      pending && "animate-spin"
+    ],
+    text: pending ? t("pending label") : t("deploy label"),
+    onClick: handleDeploy
+  }), /* @__PURE__ */ React2.createElement(ViewSelector, {
+    view,
+    onViewChange
+  }))));
+};
+var ToolbarIconButton = ({ icon, text, classNames, disabled, onClick }) => {
+  return /* @__PURE__ */ React2.createElement(Tooltip.Root, null, /* @__PURE__ */ React2.createElement(Tooltip.Trigger, {
+    asChild: true
+  }, /* @__PURE__ */ React2.createElement(NaturalToolbar.Button, {
+    variant: "ghost",
+    disabled,
+    onClick
+  }, /* @__PURE__ */ React2.createElement(Icon2, {
+    icon,
+    size: 4,
+    classNames
+  }))), /* @__PURE__ */ React2.createElement(Tooltip.Portal, null, /* @__PURE__ */ React2.createElement(Tooltip.Content, null, /* @__PURE__ */ React2.createElement(Tooltip.Arrow, null), text)));
+};
+var TemplateSelect = ({ templates: templates2 = [], onTemplateSelect }) => {
+  return /* @__PURE__ */ React2.createElement(Select.Root, {
+    value: "",
+    onValueChange: onTemplateSelect
+  }, /* @__PURE__ */ React2.createElement(Select.TriggerButton, null), /* @__PURE__ */ React2.createElement(Select.Portal, null, /* @__PURE__ */ React2.createElement(Select.Content, null, /* @__PURE__ */ React2.createElement(Select.Viewport, null, /* @__PURE__ */ React2.createElement(Select.Option, {
+    value: ""
+  }, "Template"), templates2.map(({ id, name }) => /* @__PURE__ */ React2.createElement(Select.Option, {
+    key: id,
+    value: id
+  }, name))))));
+};
+var ViewSelector = ({ view, onViewChange }) => {
+  return /* @__PURE__ */ React2.createElement(ToggleGroup, {
+    type: "single",
+    value: view,
+    onValueChange: (value) => onViewChange?.(value)
+  }, /* @__PURE__ */ React2.createElement(ToggleGroupItem, {
+    value: "editor",
+    classNames: "bg-transparent text-subdued"
+  }, /* @__PURE__ */ React2.createElement(Icon2, {
+    icon: "ph--code--regular",
+    size: 4
+  })), /* @__PURE__ */ React2.createElement(ToggleGroupItem, {
+    value: "split",
+    classNames: "bg-transparent text-subdued"
+  }, /* @__PURE__ */ React2.createElement(Icon2, {
+    icon: "ph--square-split-vertical--regular",
+    size: 4
+  })), /* @__PURE__ */ React2.createElement(ToggleGroupItem, {
+    value: "preview",
+    classNames: "bg-transparent text-subdued"
+  }, /* @__PURE__ */ React2.createElement(Icon2, {
+    icon: "ph--eye--regular",
+    size: 4
+  })));
+};
+
+// packages/plugins/experimental/plugin-script/src/components/TypescriptEditor/TypescriptEditor.tsx
+import { javascript } from "@codemirror/lang-javascript";
+import { tsSync, tsFacet, tsLinter, tsAutocomplete, tsHover } from "@valtown/codemirror-ts";
+import React3 from "react";
+import { useThemeContext } from "@dxos/react-ui";
+import { autocomplete, createBasicExtensions, createThemeExtensions, editorFullWidth, editorGutter, editorMonospace, InputModeExtensions, useTextEditor } from "@dxos/react-ui-editor";
+import { nonNullable } from "@dxos/util";
+var TypescriptEditor = ({ id, env, className, initialValue, extensions, scrollTo, selection }) => {
+  const { themeMode } = useThemeContext();
+  const { parentRef, focusAttributes } = useTextEditor(() => ({
+    id,
+    initialValue,
+    extensions: [
+      extensions,
+      createBasicExtensions({
+        highlightActiveLine: true,
+        indentWithTab: true,
+        lineNumbers: true,
+        lineWrapping: false,
+        scrollPastEnd: true
+      }),
+      createThemeExtensions({
+        themeMode,
+        syntaxHighlighting: true,
+        slots: {
+          content: {
+            className: editorFullWidth
+          }
+        }
+      }),
+      editorGutter,
+      // TODO(burdon): Factor out.
+      [
+        editorMonospace,
+        javascript({
+          typescript: true
+        }),
+        // https://github.com/val-town/codemirror-ts
+        autocomplete({
+          override: env ? [
+            tsAutocomplete()
+          ] : []
+        }),
+        env ? [
+          tsFacet.of({
+            env,
+            path: `/src/${id}.ts`
+          }),
+          tsSync(),
+          tsLinter(),
+          tsHover()
+        ] : [],
+        InputModeExtensions.vscode
+      ]
+    ].filter(nonNullable),
+    selection,
+    scrollTo
+  }), [
+    id,
+    initialValue,
+    extensions,
+    themeMode,
+    selection,
+    scrollTo
+  ]);
+  return /* @__PURE__ */ React3.createElement("div", {
+    ref: parentRef,
+    className,
+    ...focusAttributes
+  });
+};
+
+// packages/plugins/experimental/plugin-script/src/components/ScriptEditor.tsx
+var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/plugins/experimental/plugin-script/src/components/ScriptEditor.tsx";
+var ScriptEditor = ({ classNames, script, env }) => {
+  const { t } = useTranslation3(SCRIPT_PLUGIN);
+  const client = useClient();
+  const identity = useIdentity();
+  const space = getSpace(script);
+  const [fn] = useQuery(space, Filter.schema(FunctionType, (fn2) => fn2.source === script));
+  const extensions = useMemo(() => [
+    listener({
+      onChange: (text) => {
+        if (script.source && script.source?.content !== text) {
+          script.changed = true;
+        }
+      }
+    }),
+    createDataExtensions({
+      id: script.id,
+      text: script.source && createDocAccessor(script.source, [
+        "content"
+      ]),
+      space,
+      identity
+    })
+  ], [
+    script,
+    script.source,
+    space,
+    identity
+  ]);
+  const [view, setView] = useState3("editor");
+  const initialValue = useMemo(() => script.source?.content, [
+    script.source
+  ]);
+  const existingFunctionUrl = fn && getUserFunctionUrlInMetadata(getMeta(fn));
+  const [error, setError] = useState3();
+  const handleBindingChange = useCallback((binding) => {
+    fn.binding = binding;
+  }, [
+    fn
+  ]);
+  const handleFormat = useCallback(async () => {
+    if (!script.source) {
+      return;
+    }
+    try {
+      script.source.content = await format(script.source.content, {
+        parser: "typescript",
+        plugins: [
+          prettierPluginEstree,
+          prettierPluginTypescript
+        ],
+        semi: true,
+        singleQuote: true
+      });
+    } catch (err) {
+      log2.catch(err, void 0, {
+        F: __dxlog_file2,
+        L: 94,
+        S: void 0,
+        C: (f, a) => f(...a)
+      });
+    }
+  }, [
+    script.source
+  ]);
+  const handleTemplateChange = (id) => {
+    const template = templates.find((template2) => template2.id === id);
+    if (template) {
+      script.name = template.name;
+      script.source.content = template.source;
+      const metaKeys = getMeta(script).keys;
+      const oldPresetIndex = metaKeys.findIndex((key) => key.source === USERFUNCTIONS_PRESET_META_KEY);
+      if (oldPresetIndex >= 0) {
+        metaKeys.splice(oldPresetIndex, 1);
+      }
+      if (template.presetId) {
+        metaKeys.push({
+          source: USERFUNCTIONS_PRESET_META_KEY,
+          id: template.presetId
+        });
+      }
+    }
+  };
+  const handleDeploy = useCallback(async () => {
+    if (!script.source || !identity || !space) {
+      return;
+    }
+    setError(void 0);
+    try {
+      const existingFunctionId = existingFunctionUrl?.split("/").at(-1);
+      const ownerDid = existingFunctionUrl?.split("/").at(-2) ?? publicKeyToDid(identity.identityKey);
+      const bundler = new Bundler({
+        platform: "browser",
+        sandboxedModules: [],
+        remoteModules: {}
+      });
+      const buildResult = await bundler.bundle(script.source.content);
+      if (buildResult.error || !buildResult.bundle) {
+        throw buildResult.error;
+      }
+      const { result, functionId, functionVersionNumber, errorMessage } = await uploadWorkerFunction({
+        clientConfig: client.config,
+        halo: client.halo,
+        ownerDid,
+        functionId: existingFunctionId,
+        source: buildResult.bundle
+      });
+      if (result !== "success" || functionId === void 0 || functionVersionNumber === void 0) {
+        throw new Error(errorMessage);
+      }
+      log2.info("function uploaded", {
+        functionId,
+        functionVersionNumber
+      }, {
+        F: __dxlog_file2,
+        L: 142,
+        S: void 0,
+        C: (f, a) => f(...a)
+      });
+      if (fn) {
+        fn.version = functionVersionNumber;
+      }
+      const deployedFunction = fn ?? space.db.add(create(FunctionType, {
+        version: functionVersionNumber,
+        source: script
+      }));
+      const meta = getMeta(deployedFunction);
+      script.changed = false;
+      setUserFunctionUrlInMetadata(meta, `/${ownerDid}/${functionId}`);
+      setView("split");
+    } catch (err) {
+      log2.catch(err, void 0, {
+        F: __dxlog_file2,
+        L: 154,
+        S: void 0,
+        C: (f, a) => f(...a)
+      });
+      setError(t("upload failed label"));
+    }
+  }, [
+    fn,
+    existingFunctionUrl,
+    script,
+    script.name,
+    script.source
+  ]);
+  const functionUrl = useMemo(() => {
+    if (!existingFunctionUrl) {
+      return;
+    }
+    const baseUrl = new URL("functions/", client.config.values.runtime?.services?.edge?.url);
+    const relativeUrl = existingFunctionUrl.replace(/^\//, "");
+    const url = new URL(`./${relativeUrl}`, baseUrl.toString());
+    space && url.searchParams.set("spaceId", space.id);
+    url.protocol = "https";
+    return url.toString();
+  }, [
+    existingFunctionUrl,
+    space
+  ]);
+  return /* @__PURE__ */ React4.createElement("div", {
+    role: "none",
+    className: mx2("flex flex-col w-full overflow-hidden divide-y divide-separator", classNames)
+  }, /* @__PURE__ */ React4.createElement(Toolbar2, {
+    deployed: Boolean(existingFunctionUrl) && !script.changed,
+    functionUrl,
+    error,
+    view,
+    templates,
+    onDeploy: handleDeploy,
+    onFormat: handleFormat,
+    onViewChange: setView,
+    onTemplateSelect: handleTemplateChange
+  }), view !== "preview" && /* @__PURE__ */ React4.createElement(TypescriptEditor, {
+    id: script.id,
+    env,
+    initialValue,
+    extensions,
+    className: "flex is-full bs-full overflow-hidden ch-focus-ring-inset-over-all"
+  }), view !== "editor" && /* @__PURE__ */ React4.createElement(DebugPanel, {
+    functionUrl,
+    binding: fn?.binding,
+    onBindingChange: handleBindingChange
+  }));
+};
+
+// packages/plugins/experimental/plugin-script/src/components/ScriptContainer.tsx
+var ScriptContainer = ({ script, ...props }) => {
+  const attendableAttrs = useAttendableAttributes(fullyQualifiedId(script));
+  return /* @__PURE__ */ React5.createElement("div", {
+    role: "none",
+    className: mx3("flex row-span-2 w-full overflow-hidden attention-surface"),
+    ...attendableAttrs
+  }, /* @__PURE__ */ React5.createElement(ScriptEditor, {
+    ...props,
+    script
+  }));
+};
+var ScriptContainer_default = ScriptContainer;
+export {
+  ScriptContainer_default as default
+};
+//# sourceMappingURL=ScriptContainer-EAE6L5JV.mjs.map