@foxglove/extension 2.36.0 → 2.38.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@foxglove/extension",
-  "version": "2.36.0",
+  "version": "2.38.0",
   "license": "MIT",
   "author": {
     "name": "Foxglove Technologies",

package/src/experimental.ts

@@ -72,6 +72,14 @@ export namespace Experimental {
     initPanel: (context: PanelExtensionContext) => void | (() => void);
   };
 
+  /**
+   * See: {@link ExtensionContext.registerUserScriptUtility}
+   */
+  export type RegisterUserScriptUtilityArgs = {
+    name: `${string}.ts`;
+    source: string;
+  };
+
   export interface ExtensionContext extends BaseExtensionContext {
     /**
      * Register a data loader to add support for additional file formats.
@@ -99,6 +107,44 @@ export namespace Experimental {
      * optional cleanup function to run when the extension `panelElement` unmounts.
      */
     registerPanel(params: ExtensionPanelRegistration): void;
+
+    /**
+     * Register a new user-script utility.
+     *
+     * This utility is available to all user-scripts and imported by its name.
+     *
+     * Example registration:
+     *
+     * ```
+     * registerUserScriptUtility({
+     *   name: "my_add.ts",
+     *   source: `
+     * export function add(a: number, b: number) {
+     *  return a + b;
+     * }
+     * `);
+     * ```
+     *
+     * You can also keep the source code in a file and import it like this:
+     *
+     * ```
+     * import my_add from "./my_add.ts?raw";
+     *
+     * registerUserScriptUtility({ name: "my_add.ts", source: my_add });
+     * ```
+     *
+     * Example usage in a user-script:
+     *
+     * ```
+     * import { add } from "./my_add.ts";
+     *
+     * // ... call `add` in your script function or wherever needed
+     * ```
+     *
+     * @param name
+     * @param source
+     */
+    registerUserScriptUtility(args: RegisterUserScriptUtilityArgs): void;
   }
 
   export interface ExtensionModule {
@@ -118,8 +164,11 @@ export namespace Experimental {
     type: "button";
     /** Unique identifier for the button. */
     id: string;
-    /** Svg string to display in the button. Icon should be 16x16px and use the `currentColor` attribute for variants to work correctly. */
-    icon: string;
+    /**
+     * The icon to display in the button. It can be a predefined icon name from {@link PanelToolbarPredefinedIcon} or a SVGElement.
+     * If passing a SVGElement, it should be 16x16px and use the `currentColor` attribute for variants to work correctly.
+     * */
+    icon: SVGElement;
     /** Tooltip text to display when hovering over the button. */
     tooltip?: string;
     /** Function to call when the button is clicked. */
@@ -136,8 +185,11 @@ export namespace Experimental {
     type: "link";
     /** Unique identifier for the link. */
     id: string;
-    /** Svg string to display in the button. Icon should be 16x16px and use the `currentColor` attribute for variants to work correctly. */
-    icon: string;
+    /**
+     * The icon to display in the button. The SVGElement should be 16x16px and use the `currentColor`
+     * attribute for variants to work correctly.
+     * */
+    icon: SVGElement;
     /** Tooltip text to display when hovering over the button. */
     tooltip?: string;
     /** The URL to navigate to when the link is clicked. */

package/src/stable.ts

@@ -1354,6 +1354,15 @@ export type SettingsTreeFieldValue =
       input: "string";
       value?: string;
 
+      /**
+       * Optional placeholder text displayed in the field input when value is undefined
+       */
+      placeholder?: string;
+    }
+  | {
+      input: "multiline-string";
+      value?: string;
+
       /**
        * Optional placeholder text displayed in the field input when value is undefined
        */