@dxos/plugin-script 0.8.4-main.3c1ae3b → 0.8.4-main.52d7546f51

package/dist/lib/browser/chunk-BU6CGVU2.mjs

@@ -0,0 +1,137 @@
+import {
+  useCreateAndDeployScriptTemplates
+} from "./chunk-WWCDIB6Z.mjs";
+import {
+  meta
+} from "./chunk-WYR4QHPE.mjs";
+
+// src/components/DeploymentDialog/DeploymentDialog.tsx
+import React, { useEffect, useMemo } from "react";
+import { useOperationInvoker } from "@dxos/app-framework/ui";
+import { LayoutOperation } from "@dxos/app-toolkit";
+import { getSpace } from "@dxos/react-client/echo";
+import { Button, Dialog, IconButton, useTranslation } from "@dxos/react-ui";
+var DEPLOYMENT_DIALOG = `${meta.id}/deployment/dialog`;
+var DeploymentDialog = ({ accessToken, scriptTemplates }) => {
+  const { t } = useTranslation(meta.id);
+  const space = useMemo(() => getSpace(accessToken), [
+    accessToken
+  ]);
+  const { handleCreateAndDeployScripts, status } = useCreateAndDeployScriptTemplates(space, scriptTemplates);
+  const { invokePromise } = useOperationInvoker();
+  useEffect(() => {
+    if (status === "success") {
+      void invokePromise(LayoutOperation.AddToast, {
+        id: `${meta.id}/deployment-success`,
+        icon: "ph--check--regular",
+        duration: Infinity,
+        title: [
+          "script deployment toast label",
+          {
+            ns: meta.id,
+            count: scriptTemplates.length
+          }
+        ],
+        description: [
+          "script deployment toast description",
+          {
+            ns: meta.id,
+            count: scriptTemplates.length
+          }
+        ],
+        closeLabel: [
+          "script deployment toast close label",
+          {
+            ns: meta.id,
+            count: scriptTemplates.length
+          }
+        ]
+      });
+      void invokePromise(LayoutOperation.UpdateDialog, {
+        state: false
+      });
+    }
+    if (status === "error") {
+      void invokePromise(LayoutOperation.UpdateDialog, {
+        state: false
+      });
+      void invokePromise(LayoutOperation.AddToast, {
+        id: `${meta.id}/deployment-error`,
+        icon: "ph--warning--regular",
+        duration: Infinity,
+        title: [
+          "script deployment error toast label",
+          {
+            ns: meta.id,
+            count: scriptTemplates.length
+          }
+        ],
+        description: [
+          "script deployment error toast description",
+          {
+            ns: meta.id,
+            count: scriptTemplates.length
+          }
+        ],
+        closeLabel: [
+          "script deployment error toast close label",
+          {
+            ns: meta.id,
+            count: scriptTemplates.length
+          }
+        ]
+      });
+    }
+  }, [
+    status,
+    invokePromise
+  ]);
+  return /* @__PURE__ */ React.createElement(Dialog.Content, null, /* @__PURE__ */ React.createElement("div", {
+    className: "flex justify-between items-center"
+  }, /* @__PURE__ */ React.createElement(Dialog.Title, null, t("deployment dialog title")), /* @__PURE__ */ React.createElement(Dialog.Close, {
+    asChild: true
+  }, /* @__PURE__ */ React.createElement(IconButton, {
+    icon: "ph--x--regular",
+    size: 4,
+    label: "Close",
+    iconOnly: true,
+    density: "fine",
+    variant: "ghost"
+  }))), /* @__PURE__ */ React.createElement("div", {
+    role: "none",
+    className: "plb-4"
+  }, /* @__PURE__ */ React.createElement("p", null, t("deployment dialog scripts found message", {
+    count: scriptTemplates.length
+  })), /* @__PURE__ */ React.createElement("ul", {
+    className: "pbs-2"
+  }, scriptTemplates.map((template) => {
+    return /* @__PURE__ */ React.createElement("li", {
+      key: template.id
+    }, template.name);
+  }))), /* @__PURE__ */ React.createElement("div", {
+    role: "none",
+    className: "flex flex-row-reverse gap-1"
+  }, /* @__PURE__ */ React.createElement(Button, {
+    variant: "primary",
+    onClick: handleCreateAndDeployScripts,
+    disabled: status === "pending"
+  }, status === "pending" ? t("deployment dialog deploy functions pending button label", {
+    count: scriptTemplates.length
+  }) : t("deployment dialog deploy functions button label", {
+    count: scriptTemplates.length
+  })), /* @__PURE__ */ React.createElement(Dialog.Close, {
+    asChild: true,
+    disabled: status === "pending"
+  }, /* @__PURE__ */ React.createElement(Button, {
+    disabled: status === "pending"
+  }, t("deployment dialog skip button label")))));
+};
+
+// src/components/DeploymentDialog/index.ts
+var DeploymentDialog_default = DeploymentDialog;
+
+export {
+  DEPLOYMENT_DIALOG,
+  DeploymentDialog_default
+};
+//# sourceMappingURL=chunk-BU6CGVU2.mjs.map

package/dist/lib/browser/chunk-BU6CGVU2.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/DeploymentDialog/DeploymentDialog.tsx", "../../../src/components/DeploymentDialog/index.ts"],
+  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport React, { useEffect, useMemo } from 'react';\n\nimport { useOperationInvoker } from '@dxos/app-framework/ui';\nimport { LayoutOperation } from '@dxos/app-toolkit';\nimport { getSpace } from '@dxos/react-client/echo';\nimport { Button, Dialog, IconButton, useTranslation } from '@dxos/react-ui';\nimport { type AccessToken } from '@dxos/types';\n\nimport { useCreateAndDeployScriptTemplates } from '../../hooks';\nimport { meta } from '../../meta';\nimport { type Template } from '../../templates';\n\nexport const DEPLOYMENT_DIALOG = `${meta.id}/deployment/dialog`;\n\n// TODO(ZaymonFC):\n//  - Show activity and feedback to the user.\n//  - Only take an array of templateIds and get the name from the data.\n//  - Pending / onError states.\n\nexport type DeploymentDialogProps = {\n  accessToken: AccessToken.AccessToken;\n  scriptTemplates: Template[];\n};\n\nexport const DeploymentDialog = ({ accessToken, scriptTemplates }: DeploymentDialogProps) => {\n  const { t } = useTranslation(meta.id);\n  const space = useMemo(() => getSpace(accessToken), [accessToken]);\n\n  // TODO(ZaymonFC): Thinking further. All of this should get moved to intents to run async in the background.\n  //   Deployment shouldn't be tied to the lifecycle of the dialogue component.\n  const { handleCreateAndDeployScripts, status } = useCreateAndDeployScriptTemplates(space, scriptTemplates);\n  const { invokePromise } = useOperationInvoker();\n\n  useEffect(() => {\n    if (status === 'success') {\n      // TODO(ZaymonFC): We can probably re-use this toast for normal script deployment.\n      void invokePromise(LayoutOperation.AddToast, {\n        id: `${meta.id}/deployment-success`,\n        icon: 'ph--check--regular',\n        duration: Infinity,\n        title: ['script deployment toast label', { ns: meta.id, count: scriptTemplates.length }],\n        description: ['script deployment toast description', { ns: meta.id, count: scriptTemplates.length }],\n        closeLabel: ['script deployment toast close label', { ns: meta.id, count: scriptTemplates.length }],\n      });\n      void invokePromise(LayoutOperation.UpdateDialog, { state: false });\n    }\n    if (status === 'error') {\n      void invokePromise(LayoutOperation.UpdateDialog, { state: false });\n      void invokePromise(LayoutOperation.AddToast, {\n        id: `${meta.id}/deployment-error`,\n        icon: 'ph--warning--regular',\n        duration: Infinity,\n        title: ['script deployment error toast label', { ns: meta.id, count: scriptTemplates.length }],\n        description: ['script deployment error toast description', { ns: meta.id, count: scriptTemplates.length }],\n        closeLabel: ['script deployment error toast close label', { ns: meta.id, count: scriptTemplates.length }],\n      });\n    }\n  }, [status, invokePromise]);\n\n  return (\n    <Dialog.Content>\n      <div className='flex justify-between items-center'>\n        <Dialog.Title>{t('deployment dialog title')}</Dialog.Title>\n        <Dialog.Close asChild>\n          <IconButton icon='ph--x--regular' size={4} label='Close' iconOnly density='fine' variant='ghost' />\n        </Dialog.Close>\n      </div>\n      <div role='none' className='plb-4'>\n        {/* TODO: Implement deployment logic and UI. */}\n        <p>\n          {t('deployment dialog scripts found message', {\n            count: scriptTemplates.length,\n          })}\n        </p>\n        <ul className='pbs-2'>\n          {scriptTemplates.map((template) => {\n            return <li key={template.id}>{template.name}</li>;\n          })}\n        </ul>\n      </div>\n      <div role='none' className='flex flex-row-reverse gap-1'>\n        <Button variant='primary' onClick={handleCreateAndDeployScripts} disabled={status === 'pending'}>\n          {status === 'pending'\n            ? t('deployment dialog deploy functions pending button label', {\n                count: scriptTemplates.length,\n              })\n            : t('deployment dialog deploy functions button label', {\n                count: scriptTemplates.length,\n              })}\n        </Button>\n        <Dialog.Close asChild disabled={status === 'pending'}>\n          <Button disabled={status === 'pending'}>{t('deployment dialog skip button label')}</Button>\n        </Dialog.Close>\n      </div>\n    </Dialog.Content>\n  );\n};\n\nexport default DeploymentDialog;\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { DEPLOYMENT_DIALOG, DeploymentDialog } from './DeploymentDialog';\n\nexport { DEPLOYMENT_DIALOG };\n\nexport default DeploymentDialog;\n"],
+  "mappings": "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",
+  "names": ["React", "useEffect", "useMemo", "useOperationInvoker", "LayoutOperation", "getSpace", "Button", "Dialog", "IconButton", "useTranslation", "DEPLOYMENT_DIALOG", "meta", "id", "DeploymentDialog", "accessToken", "scriptTemplates", "t", "useTranslation", "space", "useMemo", "getSpace", "handleCreateAndDeployScripts", "status", "useCreateAndDeployScriptTemplates", "invokePromise", "useOperationInvoker", "useEffect", "LayoutOperation", "AddToast", "icon", "duration", "Infinity", "title", "ns", "count", "length", "description", "closeLabel", "UpdateDialog", "state", "Dialog", "Content", "div", "className", "Title", "Close", "asChild", "IconButton", "size", "label", "iconOnly", "density", "variant", "role", "p", "ul", "map", "template", "li", "key", "name", "Button", "onClick", "disabled", "DeploymentDialog"]
+}

package/dist/lib/browser/chunk-F3QKSKSF.mjs

@@ -0,0 +1,35 @@
+import {
+  __export
+} from "./chunk-J5LGTIGS.mjs";
+
+// src/blueprints/script-blueprint.ts
+var script_blueprint_exports = {};
+__export(script_blueprint_exports, {
+  Key: () => Key,
+  functions: () => functions,
+  make: () => make,
+  tools: () => tools
+});
+import { Blueprint, Template } from "@dxos/blueprints";
+import { trim } from "@dxos/util";
+var functions = [];
+var tools = [];
+var Key = "dxos.org/blueprint/script";
+var make = () => Blueprint.make({
+  key: Key,
+  name: "Script",
+  tools: Blueprint.toolDefinitions({
+    functions,
+    tools
+  }),
+  instructions: Template.make({
+    source: trim`
+        You can create and update scripts which contain Typescript code.
+      `
+  })
+});
+
+export {
+  script_blueprint_exports
+};
+//# sourceMappingURL=chunk-F3QKSKSF.mjs.map

package/dist/lib/browser/chunk-F3QKSKSF.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/blueprints/script-blueprint.ts"],
+  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { Blueprint, Template } from '@dxos/blueprints';\nimport { type FunctionDefinition } from '@dxos/functions';\nimport { trim } from '@dxos/util';\n\nexport const functions: FunctionDefinition[] = [];\nexport const tools: string[] = [];\n\nexport const Key = 'dxos.org/blueprint/script';\n\nexport const make = () =>\n  Blueprint.make({\n    key: Key,\n    name: 'Script',\n    tools: Blueprint.toolDefinitions({ functions, tools }),\n    instructions: Template.make({\n      source: trim`\n        You can create and update scripts which contain Typescript code.\n      `,\n    }),\n  });\n"],
+  "mappings": ";;;;;AAAA;;;;;;;AAIA,SAASA,WAAWC,gBAAgB;AAEpC,SAASC,YAAY;AAEd,IAAMC,YAAkC,CAAA;AACxC,IAAMC,QAAkB,CAAA;AAExB,IAAMC,MAAM;AAEZ,IAAMC,OAAO,MAClBC,UAAUD,KAAK;EACbE,KAAKH;EACLI,MAAM;EACNL,OAAOG,UAAUG,gBAAgB;IAAEP;IAAWC;EAAM,CAAA;EACpDO,cAAcC,SAASN,KAAK;IAC1BO,QAAQC;;;EAGV,CAAA;AACF,CAAA;",
+  "names": ["Blueprint", "Template", "trim", "functions", "tools", "Key", "make", "Blueprint", "key", "name", "toolDefinitions", "instructions", "Template", "source", "trim"]
+}

package/dist/lib/browser/chunk-I7CSE6T3.mjs

@@ -0,0 +1,110 @@
+// src/components/TypescriptEditor/TypescriptEditor.tsx
+import { autocompletion, completionKeymap } from "@codemirror/autocomplete";
+import { javascript } from "@codemirror/lang-javascript";
+import { HighlightStyle } from "@codemirror/language";
+import { lintKeymap } from "@codemirror/lint";
+import { Prec } from "@codemirror/state";
+import { keymap } from "@codemirror/view";
+import { tags } from "@lezer/highlight";
+import { continueKeymap } from "@valtown/codemirror-continue";
+import { tsAutocomplete, tsFacet, tsHover, tsLinter, tsSync } from "@valtown/codemirror-ts";
+import React, { memo } from "react";
+import { useThemeContext } from "@dxos/react-ui";
+import { useTextEditor } from "@dxos/react-ui-editor";
+import { Domino } from "@dxos/ui";
+import { InputModeExtensions, createBasicExtensions, createThemeExtensions, defaultStyles } from "@dxos/ui-editor";
+import { mx } from "@dxos/ui-theme";
+import { isNonNullable } from "@dxos/util";
+var TypescriptEditor = /* @__PURE__ */ memo(({ classNames, id, role = "article", inputMode = "vscode", env, options, initialValue, extensions, scrollTo, selection }) => {
+  const { themeMode } = useThemeContext();
+  const { parentRef, focusAttributes } = useTextEditor(() => ({
+    id,
+    initialValue,
+    selection,
+    scrollTo,
+    extensions: [
+      extensions,
+      createBasicExtensions({
+        highlightActiveLine: true,
+        indentWithTab: true,
+        lineNumbers: true,
+        lineWrapping: false,
+        scrollPastEnd: role !== "section",
+        search: true,
+        ...options
+      }),
+      createThemeExtensions({
+        monospace: true,
+        themeMode,
+        syntaxHighlighting: true
+      }),
+      InputModeExtensions[inputMode],
+      javascript({
+        typescript: true
+      }),
+      autocompletion({
+        override: env ? [
+          tsAutocomplete()
+        ] : void 0
+      }),
+      // Continues block comments when pressing Enter.
+      Prec.high(keymap.of(continueKeymap)),
+      keymap.of(completionKeymap),
+      keymap.of(lintKeymap),
+      // https://github.com/val-town/codemirror-ts
+      env && [
+        // TODO(burdon): Fix type.
+        tsFacet.of({
+          env,
+          path: `./src/${id}.ts`
+        }),
+        tsSync(),
+        tsLinter(),
+        tsHover({
+          renderTooltip: createTooltipRenderer(themeMode)
+        })
+      ]
+    ].filter(isNonNullable)
+  }), [
+    themeMode,
+    id,
+    extensions,
+    inputMode,
+    selection,
+    scrollTo,
+    env
+  ]);
+  return /* @__PURE__ */ React.createElement("div", {
+    ref: parentRef,
+    className: mx(classNames),
+    ...focusAttributes
+  });
+});
+var createTooltipRenderer = (themeMode) => {
+  const theme = HighlightStyle.define(themeMode === "dark" ? defaultStyles.dark : defaultStyles.light);
+  const classFromKind = (_kind) => {
+    const kind = _kind.endsWith("Name") ? "name" : _kind;
+    const validTag = kind in tags;
+    if (!validTag) {
+      return "";
+    }
+    const tag = tags[kind];
+    if (typeof tag === "function") {
+      return "";
+    }
+    return theme.style([
+      tag
+    ]) ?? "";
+  };
+  return (info) => {
+    const children = info.quickInfo?.displayParts?.map(({ kind, text }) => Domino.of("span").classNames(classFromKind(kind)).text(text)) ?? [];
+    return {
+      dom: Domino.of("div").classNames("xs:max-is-80 max-is-lg p-1 bg-baseSurface rounded border border-separator").children(...children).root
+    };
+  };
+};
+
+export {
+  TypescriptEditor
+};
+//# sourceMappingURL=chunk-I7CSE6T3.mjs.map

package/dist/lib/browser/chunk-I7CSE6T3.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/TypescriptEditor/TypescriptEditor.tsx"],
+  "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { autocompletion, completionKeymap } from '@codemirror/autocomplete';\nimport { javascript } from '@codemirror/lang-javascript';\nimport { HighlightStyle } from '@codemirror/language';\nimport { lintKeymap } from '@codemirror/lint';\nimport { Prec } from '@codemirror/state';\nimport { keymap } from '@codemirror/view';\nimport { tags } from '@lezer/highlight';\nimport { type VirtualTypeScriptEnvironment } from '@typescript/vfs';\nimport { continueKeymap } from '@valtown/codemirror-continue';\nimport { type HoverInfo, tsAutocomplete, tsFacet, tsHover, tsLinter, tsSync } from '@valtown/codemirror-ts';\nimport React, { memo } from 'react';\n\nimport { type ThemeMode, type ThemedClassName, useThemeContext } from '@dxos/react-ui';\nimport { type UseTextEditorProps, useTextEditor } from '@dxos/react-ui-editor';\nimport { Domino } from '@dxos/ui';\nimport {\n  type BasicExtensionsOptions,\n  type EditorInputMode,\n  InputModeExtensions,\n  createBasicExtensions,\n  createThemeExtensions,\n  defaultStyles,\n} from '@dxos/ui-editor';\nimport { mx } from '@dxos/ui-theme';\nimport { isNonNullable } from '@dxos/util';\n\nexport type TypescriptEditorProps = ThemedClassName<\n  {\n    id: string;\n    role?: string;\n    inputMode?: EditorInputMode;\n    toolbar?: boolean;\n    env?: VirtualTypeScriptEnvironment;\n    options?: BasicExtensionsOptions;\n  } & Pick<UseTextEditorProps, 'initialValue' | 'extensions' | 'scrollTo' | 'selection'>\n>;\n\nexport const TypescriptEditor = memo(\n  ({\n    classNames,\n    id,\n    role = 'article',\n    inputMode = 'vscode',\n    env,\n    options,\n    initialValue,\n    extensions,\n    scrollTo,\n    selection,\n  }: TypescriptEditorProps) => {\n    const { themeMode } = useThemeContext();\n    const { parentRef, focusAttributes } = useTextEditor(\n      () => ({\n        id,\n        initialValue,\n        selection,\n        scrollTo,\n        extensions: [\n          extensions,\n          createBasicExtensions({\n            highlightActiveLine: true,\n            indentWithTab: true,\n            lineNumbers: true,\n            lineWrapping: false,\n            scrollPastEnd: role !== 'section',\n            search: true,\n            ...options,\n          }),\n          createThemeExtensions({\n            monospace: true,\n            themeMode,\n            syntaxHighlighting: true,\n          }),\n\n          InputModeExtensions[inputMode],\n          javascript({ typescript: true }),\n          autocompletion({ override: env ? [tsAutocomplete()] : undefined }),\n\n          // Continues block comments when pressing Enter.\n          Prec.high(keymap.of(continueKeymap)),\n          keymap.of(completionKeymap),\n          keymap.of(lintKeymap),\n\n          // https://github.com/val-town/codemirror-ts\n          env && [\n            // TODO(burdon): Fix type.\n            tsFacet.of({ env: env as any, path: `./src/${id}.ts` }),\n            tsSync(),\n            tsLinter(),\n            tsHover({ renderTooltip: createTooltipRenderer(themeMode) }),\n          ],\n        ].filter(isNonNullable),\n      }),\n      [themeMode, id, extensions, inputMode, selection, scrollTo, env],\n    );\n\n    return <div ref={parentRef} className={mx(classNames)} {...focusAttributes} />;\n  },\n);\n\n// TODO(burdon): Factor out (react-ui-editor).\nconst createTooltipRenderer = (themeMode: ThemeMode) => {\n  const theme = HighlightStyle.define(themeMode === 'dark' ? defaultStyles.dark : defaultStyles.light);\n\n  const classFromKind = (_kind: string) => {\n    // E.g., localName, methodName, parameterName, etc.\n    const kind = _kind.endsWith('Name') ? 'name' : _kind;\n    const validTag = kind in tags;\n    if (!validTag) {\n      return '';\n    }\n\n    const tag = tags[kind as keyof typeof tags];\n    if (typeof tag === 'function') {\n      return '';\n    }\n\n    return theme.style([tag]) ?? '';\n  };\n\n  return (info: HoverInfo) => {\n    const children =\n      info.quickInfo?.displayParts?.map(({ kind, text }) =>\n        Domino.of('span').classNames(classFromKind(kind)).text(text),\n      ) ?? [];\n    return {\n      dom: Domino.of('div')\n        .classNames('xs:max-is-80 max-is-lg p-1 bg-baseSurface rounded border border-separator')\n        .children(...children).root,\n    };\n  };\n};\n\nexport default TypescriptEditor;\n"],
+  "mappings": ";AAIA,SAASA,gBAAgBC,wBAAwB;AACjD,SAASC,kBAAkB;AAC3B,SAASC,sBAAsB;AAC/B,SAASC,kBAAkB;AAC3B,SAASC,YAAY;AACrB,SAASC,cAAc;AACvB,SAASC,YAAY;AAErB,SAASC,sBAAsB;AAC/B,SAAyBC,gBAAgBC,SAASC,SAASC,UAAUC,cAAc;AACnF,OAAOC,SAASC,YAAY;AAE5B,SAA+CC,uBAAuB;AACtE,SAAkCC,qBAAqB;AACvD,SAASC,cAAc;AACvB,SAGEC,qBACAC,uBACAC,uBACAC,qBACK;AACP,SAASC,UAAU;AACnB,SAASC,qBAAqB;AAavB,IAAMC,mBAAmBC,qBAC9B,CAAC,EACCC,YACAC,IACAC,OAAO,WACPC,YAAY,UACZC,KACAC,SACAC,cACAC,YACAC,UACAC,UAAS,MACa;AACtB,QAAM,EAAEC,UAAS,IAAKC,gBAAAA;AACtB,QAAM,EAAEC,WAAWC,gBAAe,IAAKC,cACrC,OAAO;IACLb;IACAK;IACAG;IACAD;IACAD,YAAY;MACVA;MACAQ,sBAAsB;QACpBC,qBAAqB;QACrBC,eAAe;QACfC,aAAa;QACbC,cAAc;QACdC,eAAelB,SAAS;QACxBmB,QAAQ;QACR,GAAGhB;MACL,CAAA;MACAiB,sBAAsB;QACpBC,WAAW;QACXb;QACAc,oBAAoB;MACtB,CAAA;MAEAC,oBAAoBtB,SAAAA;MACpBuB,WAAW;QAAEC,YAAY;MAAK,CAAA;MAC9BC,eAAe;QAAEC,UAAUzB,MAAM;UAAC0B,eAAAA;YAAoBC;MAAU,CAAA;;MAGhEC,KAAKC,KAAKC,OAAOC,GAAGC,cAAAA,CAAAA;MACpBF,OAAOC,GAAGE,gBAAAA;MACVH,OAAOC,GAAGG,UAAAA;;MAGVlC,OAAO;;QAELmC,QAAQJ,GAAG;UAAE/B;UAAiBoC,MAAM,SAASvC,EAAAA;QAAQ,CAAA;QACrDwC,OAAAA;QACAC,SAAAA;QACAC,QAAQ;UAAEC,eAAeC,sBAAsBnC,SAAAA;QAAW,CAAA;;MAE5DoC,OAAOC,aAAAA;EACX,IACA;IAACrC;IAAWT;IAAIM;IAAYJ;IAAWM;IAAWD;IAAUJ;GAAI;AAGlE,SAAO,sBAAA,cAAC4C,OAAAA;IAAIC,KAAKrC;IAAWsC,WAAWC,GAAGnD,UAAAA;IAAc,GAAGa;;AAC7D,CAAA;AAIF,IAAMgC,wBAAwB,CAACnC,cAAAA;AAC7B,QAAM0C,QAAQC,eAAeC,OAAO5C,cAAc,SAAS6C,cAAcC,OAAOD,cAAcE,KAAK;AAEnG,QAAMC,gBAAgB,CAACC,UAAAA;AAErB,UAAMC,OAAOD,MAAME,SAAS,MAAA,IAAU,SAASF;AAC/C,UAAMG,WAAWF,QAAQG;AACzB,QAAI,CAACD,UAAU;AACb,aAAO;IACT;AAEA,UAAME,MAAMD,KAAKH,IAAAA;AACjB,QAAI,OAAOI,QAAQ,YAAY;AAC7B,aAAO;IACT;AAEA,WAAOZ,MAAMa,MAAM;MAACD;KAAI,KAAK;EAC/B;AAEA,SAAO,CAACE,SAAAA;AACN,UAAMC,WACJD,KAAKE,WAAWC,cAAcC,IAAI,CAAC,EAAEV,MAAMW,KAAI,MAC7CC,OAAOrC,GAAG,MAAA,EAAQnC,WAAW0D,cAAcE,IAAAA,CAAAA,EAAOW,KAAKA,IAAAA,CAAAA,KACpD,CAAA;AACP,WAAO;MACLE,KAAKD,OAAOrC,GAAG,KAAA,EACZnC,WAAW,2EAAA,EACXmE,SAAQ,GAAIA,QAAAA,EAAUO;IAC3B;EACF;AACF;",
+  "names": ["autocompletion", "completionKeymap", "javascript", "HighlightStyle", "lintKeymap", "Prec", "keymap", "tags", "continueKeymap", "tsAutocomplete", "tsFacet", "tsHover", "tsLinter", "tsSync", "React", "memo", "useThemeContext", "useTextEditor", "Domino", "InputModeExtensions", "createBasicExtensions", "createThemeExtensions", "defaultStyles", "mx", "isNonNullable", "TypescriptEditor", "memo", "classNames", "id", "role", "inputMode", "env", "options", "initialValue", "extensions", "scrollTo", "selection", "themeMode", "useThemeContext", "parentRef", "focusAttributes", "useTextEditor", "createBasicExtensions", "highlightActiveLine", "indentWithTab", "lineNumbers", "lineWrapping", "scrollPastEnd", "search", "createThemeExtensions", "monospace", "syntaxHighlighting", "InputModeExtensions", "javascript", "typescript", "autocompletion", "override", "tsAutocomplete", "undefined", "Prec", "high", "keymap", "of", "continueKeymap", "completionKeymap", "lintKeymap", "tsFacet", "path", "tsSync", "tsLinter", "tsHover", "renderTooltip", "createTooltipRenderer", "filter", "isNonNullable", "div", "ref", "className", "mx", "theme", "HighlightStyle", "define", "defaultStyles", "dark", "light", "classFromKind", "_kind", "kind", "endsWith", "validTag", "tags", "tag", "style", "info", "children", "quickInfo", "displayParts", "map", "text", "Domino", "dom", "root"]
+}