@dxos/plugin-script 0.6.13-main.ed424a1 → 0.6.13

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

@@ -1,666 +0,0 @@
-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