@dxos/app-framework 0.3.10-main.92d1f2c → 0.3.10-main.a0865c9

package/dist/lib/browser/index.mjs

@@ -44,7 +44,7 @@ var parseLayoutPlugin = (plugin) => {
   const { success } = Layout.safeParse(plugin.provides.layout);
   return success ? plugin : void 0;
 };
-var LAYOUT_ACTION = "dxos.org/plugin/intent";
+var LAYOUT_ACTION = "dxos.org/plugin/layout";
 var LayoutAction;
 (function(LayoutAction2) {
   LayoutAction2[LayoutAction2["TOGGLE_FULLSCREEN"] = `${LAYOUT_ACTION}/toggle-fullscreen`] = "TOGGLE_FULLSCREEN";
@@ -55,12 +55,6 @@ var LayoutAction;
   LayoutAction2[LayoutAction2["OPEN_POPOVER"] = `${LAYOUT_ACTION}/open-popover`] = "OPEN_POPOVER";
   LayoutAction2[LayoutAction2["CLOSE_POPOVER"] = `${LAYOUT_ACTION}/close-popover`] = "CLOSE_POPOVER";
   LayoutAction2[LayoutAction2["ACTIVATE"] = `${LAYOUT_ACTION}/activate`] = "ACTIVATE";
-  LayoutAction2[LayoutAction2[
-    // TODO(burdon): Move to new plugin.
-    "OPEN_COMMANDS"
-  ] = `${LAYOUT_ACTION}/open-commands`] = "OPEN_COMMANDS";
-  LayoutAction2[LayoutAction2["OPEN_SETTINGS"] = `${LAYOUT_ACTION}/open-settings`] = "OPEN_SETTINGS";
-  LayoutAction2[LayoutAction2["OPEN_SHORTCUTS"] = `${LAYOUT_ACTION}/open-shortcuts`] = "OPEN_SHORTCUTS";
 })(LayoutAction || (LayoutAction = {}));
 
 // packages/sdk/app-framework/src/plugins/common/metadata.ts
@@ -71,6 +65,16 @@ var parseMetadataResolverPlugin = (plugin) => {
   return plugin.provides.metadata?.resolver ? plugin : void 0;
 };
 
+// packages/sdk/app-framework/src/plugins/common/settings.ts
+var parseSettingsPlugin = (plugin) => {
+  return typeof plugin.provides.settings === "object" ? plugin : void 0;
+};
+var SETTINGS_ACTION = "dxos.org/plugin/settings";
+var SettingsAction;
+(function(SettingsAction2) {
+  SettingsAction2[SettingsAction2["OPEN"] = `${SETTINGS_ACTION}/open`] = "OPEN";
+})(SettingsAction || (SettingsAction = {}));
+
 // packages/sdk/app-framework/src/plugins/common/translations.ts
 import { z as z2 } from "zod";
 var ResourceKey = z2.union([
@@ -84,99 +88,6 @@ var parseTranslationsPlugin = (plugin) => {
   return success ? plugin : void 0;
 };
 
-// packages/sdk/app-framework/src/plugins/components/CommandsDialog.tsx
-import { DotOutline } from "@phosphor-icons/react";
-import React, { useMemo, useRef } from "react";
-import { Keyboard, keySymbols } from "@dxos/keyboard";
-import { Button, Dialog, useTranslation } from "@dxos/react-ui";
-import { SearchList } from "@dxos/react-ui-searchlist";
-import { descriptionText, getSize, mx } from "@dxos/react-ui-theme";
-var CommandsDialogContent = ({ graph }) => {
-  const { t } = useTranslation("os");
-  const toString = (label) => Array.isArray(label) ? t(...label) : label;
-  const actions = useMemo(() => {
-    const current = Keyboard.singleton.getCurrentContext();
-    const actionMap = /* @__PURE__ */ new Set();
-    const actions2 = [];
-    graph?.traverse({
-      visitor: (node, path) => {
-        if (current.startsWith(path.join("/"))) {
-          node.actions.forEach((action) => {
-            if (!actionMap.has(action.id)) {
-              actionMap.add(action.id);
-              actions2.push(action);
-            }
-          });
-        }
-      }
-    });
-    actions2.sort(({ label: a }, { label: b }) => {
-      return toString(a)?.toLowerCase().localeCompare(toString(b)?.toLowerCase());
-    });
-    return actions2;
-  }, [
-    graph
-  ]);
-  const buttonRef = useRef(null);
-  return /* @__PURE__ */ React.createElement(Dialog.Content, {
-    classNames: [
-      "md:max-is-[30rem] overflow-hidden"
-    ]
-  }, /* @__PURE__ */ React.createElement(Dialog.Title, null, t("commands dialog title", {
-    ns: "os"
-  })), /* @__PURE__ */ React.createElement(SearchList.Root, {
-    label: t("commandlist input placeholder"),
-    classNames: "flex flex-col grow overflow-hidden my-2"
-  }, /* @__PURE__ */ React.createElement(SearchList.Input, {
-    placeholder: t("commandlist input placeholder"),
-    classNames: mx("px-1 my-2")
-  }), /* @__PURE__ */ React.createElement(SearchList.Content, {
-    classNames: [
-      "max-bs-[30rem] overflow-auto"
-    ]
-  }, actions?.map((action) => {
-    const label = toString(action.label);
-    const Icon = action.icon ?? DotOutline;
-    return /* @__PURE__ */ React.createElement(SearchList.Item, {
-      value: label,
-      key: action.id,
-      onSelect: () => {
-        if (action.properties.disabled) {
-          return;
-        }
-        buttonRef.current?.click();
-        setTimeout(() => {
-          void action.invoke();
-        });
-      },
-      classNames: "flex items-center gap-2",
-      disabled: action.properties.disabled,
-      ...action.properties?.testId && {
-        "data-testid": action.properties.testId
-      }
-    }, /* @__PURE__ */ React.createElement(Icon, {
-      className: mx(getSize(4), "shrink-0", !action.icon && "invisible")
-    }), /* @__PURE__ */ React.createElement("span", {
-      className: "grow truncate"
-    }, label), action.keyBinding && /* @__PURE__ */ React.createElement("span", {
-      className: mx("shrink-0", descriptionText)
-    }, keySymbols(action.keyBinding).join("")));
-  }))), /* @__PURE__ */ React.createElement(Dialog.Close, {
-    asChild: true
-  }, /* @__PURE__ */ React.createElement(Button, {
-    ref: buttonRef,
-    variant: "primary",
-    classNames: "mbs-2"
-  }, t("close label", {
-    ns: "os"
-  }))));
-};
-
-// packages/sdk/app-framework/src/plugins/components/SettingsDialog.tsx
-import React5, { useState } from "react";
-import { Button as Button2, Dialog as Dialog2, List, ListItem, useTranslation as useTranslation2 } from "@dxos/react-ui";
-import { ghostHover, ghostSelected, groupBorder, mx as mx2 } from "@dxos/react-ui-theme";
-
 // packages/sdk/app-framework/src/plugins/PluginHost/plugin.ts
 var pluginMeta = (meta) => meta;
 var Plugin;
@@ -211,7 +122,7 @@ var PluginProvider = PluginContext.Provider;
 
 // packages/sdk/app-framework/src/plugins/PluginHost/PluginHost.tsx
 import { shallow } from "deepsignal/react";
-import React2, { useEffect } from "react";
+import React, { useEffect } from "react";
 import { LocalStorageStore } from "@dxos/local-storage";
 import { log } from "@dxos/log";
 var __dxlog_file = "/home/runner/work/dxos/dxos/packages/sdk/app-framework/src/plugins/PluginHost/PluginHost.tsx";
@@ -244,7 +155,7 @@ var PluginHost = ({ order, plugins: definitions, core = [], defaults = [], fallb
     },
     provides: {
       plugins: state.values,
-      context: ({ children }) => /* @__PURE__ */ React2.createElement(PluginProvider, {
+      context: ({ children }) => /* @__PURE__ */ React.createElement(PluginProvider, {
         value: state.values
       }, children),
       root: () => {
@@ -302,10 +213,10 @@ var PluginHost = ({ order, plugins: definitions, core = [], defaults = [], fallb
           };
         }, []);
         if (!state.values.ready) {
-          return /* @__PURE__ */ React2.createElement(React2.Fragment, null, fallback);
+          return /* @__PURE__ */ React.createElement(React.Fragment, null, fallback);
         }
         const ComposedContext = composeContext(state.values.plugins);
-        return /* @__PURE__ */ React2.createElement(ComposedContext, null, rootComponents(state.values.plugins));
+        return /* @__PURE__ */ React.createElement(ComposedContext, null, rootComponents(state.values.plugins));
       }
     }
   };
@@ -324,7 +235,7 @@ var rootComponents = (plugins) => {
   return plugins.map((plugin) => {
     const Component2 = plugin.provides.root;
     if (Component2) {
-      return /* @__PURE__ */ React2.createElement(Component2, {
+      return /* @__PURE__ */ React.createElement(Component2, {
         key: plugin.meta.id
       });
     } else {
@@ -338,14 +249,14 @@ var composeContext = (plugins) => {
 var compose = (contexts) => {
   return [
     ...contexts
-  ].reduce((Acc, Next) => ({ children }) => /* @__PURE__ */ React2.createElement(Acc, null, /* @__PURE__ */ React2.createElement(Next, null, children)));
+  ].reduce((Acc, Next) => ({ children }) => /* @__PURE__ */ React.createElement(Acc, null, /* @__PURE__ */ React.createElement(Next, null, children)));
 };
 
 // packages/sdk/app-framework/src/plugins/SurfacePlugin/helpers.ts
 var isObject = (data) => !!data && typeof data === "object";
 
 // packages/sdk/app-framework/src/plugins/SurfacePlugin/ErrorBoundary.tsx
-import React3, { Component } from "react";
+import React2, { Component } from "react";
 var ErrorBoundary = class extends Component {
   constructor(props) {
     super(props);
@@ -365,7 +276,7 @@ var ErrorBoundary = class extends Component {
   }
   render() {
     if (this.state.error) {
-      return /* @__PURE__ */ React3.createElement(this.props.fallback, {
+      return /* @__PURE__ */ React2.createElement(this.props.fallback, {
         error: this.state.error,
         reset: this.resetError
       });
@@ -380,7 +291,7 @@ var ErrorBoundary = class extends Component {
 };
 
 // packages/sdk/app-framework/src/plugins/SurfacePlugin/Surface.tsx
-import React4, { forwardRef, Fragment, isValidElement } from "react";
+import React3, { forwardRef, Fragment, isValidElement } from "react";
 import { createContext as createContext2, useContext as useContext2 } from "react";
 var Surface = /* @__PURE__ */ forwardRef(({ role, name = role, fallback, ...rest }, forwardedRef) => {
   const props = {
@@ -391,13 +302,13 @@ var Surface = /* @__PURE__ */ forwardRef(({ role, name = role, fallback, ...rest
   };
   const context = useContext2(SurfaceContext);
   const data = props.data ?? (name && context?.surfaces?.[name]?.data || {});
-  return /* @__PURE__ */ React4.createElement(React4.Fragment, null, fallback ? /* @__PURE__ */ React4.createElement(ErrorBoundary, {
+  return /* @__PURE__ */ React3.createElement(React3.Fragment, null, fallback ? /* @__PURE__ */ React3.createElement(ErrorBoundary, {
     data,
     fallback
-  }, /* @__PURE__ */ React4.createElement(SurfaceResolver, {
+  }, /* @__PURE__ */ React3.createElement(SurfaceResolver, {
     ...props,
     ref: forwardedRef
-  })) : /* @__PURE__ */ React4.createElement(SurfaceResolver, {
+  })) : /* @__PURE__ */ React3.createElement(SurfaceResolver, {
     ...props,
     ref: forwardedRef
   }));
@@ -414,9 +325,9 @@ var SurfaceResolver = /* @__PURE__ */ forwardRef((props, forwardedRef) => {
       ...props.surfaces
     }
   };
-  return /* @__PURE__ */ React4.createElement(SurfaceContext.Provider, {
+  return /* @__PURE__ */ React3.createElement(SurfaceContext.Provider, {
     value: currentContext
-  }, nodes.length > 0 ? nodes : props.contentFallback ? /* @__PURE__ */ React4.createElement(props.contentFallback, null) : null);
+  }, nodes.length > 0 ? nodes : props.contentFallback ? /* @__PURE__ */ React3.createElement(props.contentFallback, null) : null);
 });
 var resolveNodes = (components, props, context, forwardedRef) => {
   const data = {
@@ -451,153 +362,14 @@ var resolveNodes = (components, props, context, forwardedRef) => {
       return 1;
     }
     return 0;
-  }).map(([key, result]) => /* @__PURE__ */ React4.createElement(Fragment, {
+  }).map(([key, result]) => /* @__PURE__ */ React3.createElement(Fragment, {
     key
   }, result.node));
   return props.limit ? nodes.slice(0, props.limit) : nodes;
 };
 
-// packages/sdk/app-framework/src/plugins/components/SettingsDialog.tsx
-var SettingsDialogContent = () => {
-  const { t } = useTranslation2("os");
-  const [plugin, setPlugin] = useState("dxos.org/plugin/registry");
-  const { plugins, enabled } = usePlugins();
-  const core = [
-    "dxos.org/plugin/layout",
-    "dxos.org/plugin/client",
-    "dxos.org/plugin/space",
-    "dxos.org/plugin/registry"
-  ];
-  const filteredPlugins = enabled.map((id) => plugins.find((plugin2) => plugin2.meta.id === id)).filter((plugin2) => plugin2?.provides?.settings).map((plugin2) => plugin2.meta).sort(({ name: a }, { name: b }) => a?.localeCompare(b ?? "") ?? 0);
-  return /* @__PURE__ */ React5.createElement(Dialog2.Content, {
-    classNames: [
-      "h-full md:max-is-[40rem] overflow-hidden"
-    ]
-  }, /* @__PURE__ */ React5.createElement(Dialog2.Title, null, t("settings dialog title", {
-    ns: "os"
-  })), /* @__PURE__ */ React5.createElement("div", {
-    className: "flex grow mlb-4 overflow-hidden"
-  }, /* @__PURE__ */ React5.createElement("div", {
-    className: mx2("flex flex-col w-[200px] space-y-4 pr-4 border-r overflow-y-auto", groupBorder)
-  }, /* @__PURE__ */ React5.createElement(PluginList, {
-    title: "Options",
-    plugins: core.map((id) => plugins.find((p) => p.meta.id === id).meta),
-    selected: plugin,
-    onSelect: (plugin2) => setPlugin(plugin2)
-  }), /* @__PURE__ */ React5.createElement(PluginList, {
-    title: "Plugins",
-    plugins: filteredPlugins,
-    selected: plugin,
-    onSelect: (plugin2) => setPlugin(plugin2)
-  })), /* @__PURE__ */ React5.createElement("div", {
-    className: mx2("flex flex-col w-full md:px-4 divide-y overflow-y-auto", groupBorder)
-  }, /* @__PURE__ */ React5.createElement(Surface, {
-    role: "settings",
-    data: {
-      plugin
-    }
-  }))), /* @__PURE__ */ React5.createElement(Dialog2.Close, {
-    asChild: true
-  }, /* @__PURE__ */ React5.createElement(Button2, {
-    variant: "primary",
-    classNames: "mbs-2",
-    autoFocus: true
-  }, t("done label", {
-    ns: "os"
-  }))));
-};
-var PluginList = ({ title, plugins, selected, onSelect }) => {
-  return /* @__PURE__ */ React5.createElement("div", {
-    role: "none"
-  }, /* @__PURE__ */ React5.createElement("h2", {
-    className: "my-1 px-2 text-sm text-neutral-500"
-  }, title), /* @__PURE__ */ React5.createElement(List, {
-    selectable: true
-  }, plugins.map((plugin) => /* @__PURE__ */ React5.createElement(ListItem.Root, {
-    key: plugin.id,
-    onClick: () => onSelect(plugin.id),
-    selected: plugin.id === selected,
-    classNames: [
-      "px-2 rounded",
-      plugin.id === selected && ghostSelected,
-      ghostHover
-    ]
-  }, /* @__PURE__ */ React5.createElement(ListItem.Heading, {
-    classNames: [
-      "flex w-full items-center cursor-pointer"
-    ]
-  }, plugin.name)))));
-};
-
-// packages/sdk/app-framework/src/plugins/components/SettingsValue.tsx
-import React6 from "react";
-import { Input } from "@dxos/react-ui";
-var SettingsValue = ({ label, description, children }) => {
-  return /* @__PURE__ */ React6.createElement("div", {
-    role: "none",
-    className: "flex w-full gap-4 py-1"
-  }, /* @__PURE__ */ React6.createElement(Input.Root, null, /* @__PURE__ */ React6.createElement("div", {
-    role: "none",
-    className: "flex flex-col w-full"
-  }, /* @__PURE__ */ React6.createElement(Input.Label, {
-    classNames: "flex min-h-[40px] items-center"
-  }, label), description && /* @__PURE__ */ React6.createElement(Input.DescriptionAndValidation, {
-    classNames: "mbs-0.5"
-  }, /* @__PURE__ */ React6.createElement(Input.Description, null, description))), /* @__PURE__ */ React6.createElement("div", {
-    role: "none"
-  }, /* @__PURE__ */ React6.createElement("div", {
-    role: "none",
-    className: "flex min-h-[40px] items-center"
-  }, children))));
-};
-
-// packages/sdk/app-framework/src/plugins/components/ShortcutsDialog.tsx
-import React7 from "react";
-import { Keyboard as Keyboard2, keySymbols as keySymbols2 } from "@dxos/keyboard";
-import { Button as Button3, Dialog as Dialog3, useTranslation as useTranslation3 } from "@dxos/react-ui";
-import { mx as mx3 } from "@dxos/react-ui-theme";
-var ShortcutsDialogContent = () => {
-  const { t } = useTranslation3("os");
-  const toString = (label) => Array.isArray(label) ? t(...label) : label;
-  const bindings = Keyboard2.singleton.getBindings();
-  bindings.sort((a, b) => {
-    return toString(a.data)?.toLowerCase().localeCompare(toString(b.data)?.toLowerCase());
-  });
-  return /* @__PURE__ */ React7.createElement(Dialog3.Content, {
-    classNames: [
-      "max-bs-[40rem] md:max-is-[30rem] overflow-hidden"
-    ]
-  }, /* @__PURE__ */ React7.createElement(Dialog3.Title, null, t("shortcuts dialog title", {
-    ns: "os"
-  })), /* @__PURE__ */ React7.createElement("div", {
-    className: "grow overflow-y-auto py-2"
-  }, /* @__PURE__ */ React7.createElement("table", {
-    className: "table-fixed border-collapse my-4"
-  }, /* @__PURE__ */ React7.createElement("tbody", null, bindings.map((binding, i) => /* @__PURE__ */ React7.createElement("tr", {
-    key: i
-  }, /* @__PURE__ */ React7.createElement("td", {
-    className: "p-1 w-[120px]"
-  }, /* @__PURE__ */ React7.createElement("div", {
-    className: "flex gap-1"
-  }, keySymbols2(binding.binding).map((c, i2) => /* @__PURE__ */ React7.createElement("span", {
-    key: i2,
-    className: mx3("inline-flex w-[24px] h-[24px] justify-center items-center text-xs", "rounded border border-neutral-300 dark:border-neutral-600 bg-neutral-50 dark:bg-neutral-850")
-  }, c)))), /* @__PURE__ */ React7.createElement("td", {
-    className: "p-1"
-  }, /* @__PURE__ */ React7.createElement("span", {
-    className: "grow truncate"
-  }, toString(binding.data)))))))), /* @__PURE__ */ React7.createElement(Dialog3.Close, {
-    asChild: true
-  }, /* @__PURE__ */ React7.createElement(Button3, {
-    variant: "primary",
-    classNames: "mbs-2"
-  }, t("close label", {
-    ns: "os"
-  }))));
-};
-
 // packages/sdk/app-framework/src/App.tsx
-import React8 from "react";
+import React4 from "react";
 import { invariant } from "@dxos/invariant";
 var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/sdk/app-framework/src/App.tsx";
 var createApp = ({ order, plugins, core = order.map(({ id }) => id), ...params }) => {
@@ -639,10 +411,9 @@ var createApp = ({ order, plugins, core = order.map(({ id }) => id), ...params }
   });
   const Context = host.provides.context;
   const Root = host.provides.root;
-  return () => /* @__PURE__ */ React8.createElement(Context, null, /* @__PURE__ */ React8.createElement(Root, null));
+  return () => /* @__PURE__ */ React4.createElement(Context, null, /* @__PURE__ */ React4.createElement(Root, null));
 };
 export {
-  CommandsDialogContent,
   ErrorBoundary,
   IntentProvider,
   Layout,
@@ -653,9 +424,7 @@ export {
   Resource,
   ResourceKey,
   ResourceLanguage,
-  SettingsDialogContent,
-  SettingsValue,
-  ShortcutsDialogContent,
+  SettingsAction,
   Surface,
   SurfaceProvider,
   createApp,
@@ -673,6 +442,7 @@ export {
   parseMetadataResolverPlugin,
   parsePluginHost,
   parseRootSurfacePlugin,
+  parseSettingsPlugin,
   parseSurfacePlugin,
   parseTranslationsPlugin,
   pluginMeta,