chore(script/jsx): move defineWidget into Preact API

apps/client/src/services/bundle.ts

@@ -1,7 +1,8 @@
 import BasicWidget from "../widgets/basic_widget.js";
 import RightPanelWidget from "../widgets/right_panel_widget.js";
 import froca from "./froca.js";
-import type { Entity, WidgetDefinition } from "./frontend_script_api.js";
+import type { Entity } from "./frontend_script_api.js";
+import { WidgetDefinitionWithType } from "./frontend_script_api_preact.js";
 import { t } from "./i18n.js";
 import ScriptContext from "./script_context.js";
 import server from "./server.js";
@@ -19,7 +20,7 @@ export interface Bundle {
 type LegacyWidget = (BasicWidget | RightPanelWidget) & {
     parentWidget?: string;
 };
-export type Widget = (LegacyWidget | WidgetDefinition) & {
+export type Widget = (LegacyWidget | WidgetDefinitionWithType) & {
     _noteId: string;
 };
 
@@ -66,7 +67,7 @@ async function executeStartupBundles() {
 
 export class WidgetsByParent {
     private legacyWidgets: Record<string, LegacyWidget[]>;
-    private preactWidgets: Record<string, WidgetDefinition[]>;
+    private preactWidgets: Record<string, WidgetDefinitionWithType[]>;
 
     constructor() {
         this.legacyWidgets = {};
@@ -76,7 +77,7 @@ export class WidgetsByParent {
     add(widget: Widget) {
         if ("type" in widget && widget.type === "react-widget") {
             // React-based script.
-            const reactWidget = widget as WidgetDefinition;
+            const reactWidget = widget as WidgetDefinitionWithType;
             this.preactWidgets[reactWidget.parent] = this.preactWidgets[reactWidget.parent] || [];
             this.preactWidgets[reactWidget.parent].push(reactWidget);
         } else if ("parentWidget" in widget && widget.parentWidget) {

apps/client/src/services/frontend_script_api.ts

@@ -1,5 +1,4 @@
 import { dayjs, formatLogMessage } from "@triliumnext/commons";
-import { VNode } from "preact";
 
 import appContext from "../components/app_context.js";
 import type Component from "../components/component.js";
@@ -467,27 +466,9 @@ export interface Api {
      */
     log(message: string | object): void;
 
-
-    // Preact support
-    /**
-     * Method that must be run for widget scripts that run on Preact, using JSX. The method just returns the same definition, reserved for future typechecking and perhaps validation purposes.
-     *
-     * @param definition the widget definition.
-     */
-    defineWidget(definition: WidgetDefinition): void;
-
     preact: typeof preactAPI;
 }
 
-export interface WidgetDefinition {
-    parent: "right-pane",
-    render: () => VNode
-}
-
-export interface WidgetDefinitionWithType extends WidgetDefinition {
-    type: "react-widget"
-}
-
 /**
  * <p>This is the main frontend API interface for scripts. All the properties and methods are published in the "api" object
  * available in the JS frontend notes. You can use e.g. <code>api.showMessage(api.startNote.title);</code></p>
@@ -744,13 +725,6 @@ function FrontendScriptApi(this: Api, startNote: FNote, currentNote: FNote, orig
         this.logSpacedUpdates[noteId].scheduleUpdate();
     };
 
-    // React support.
-    this.defineWidget = (definition) => {
-        return {
-            type: "react-widget",
-            ...definition
-        };
-    };
     this.preact = preactAPI;
 }
 

apps/client/src/services/frontend_script_api_preact.ts

@@ -1,13 +1,34 @@
-import { Fragment, h } from "preact";
+import { Fragment, h, VNode } from "preact";
 import * as hooks from "preact/hooks";
 
 import RightPanelWidget from "../widgets/sidebar/RightPanelWidget";
 
+export interface WidgetDefinition {
+    parent: "right-pane",
+    render: () => VNode
+}
+
+export interface WidgetDefinitionWithType extends WidgetDefinition {
+    type: "react-widget"
+}
+
 export const preactAPI = Object.freeze({
     // Core
     h,
     Fragment,
 
+    /**
+     * Method that must be run for widget scripts that run on Preact, using JSX. The method just returns the same definition, reserved for future typechecking and perhaps validation purposes.
+     *
+     * @param definition the widget definition.
+     */
+    defineWidget(definition: WidgetDefinition) {
+        return {
+            type: "react-widget",
+            ...definition
+        };
+    },
+
     RightPanelWidget,
 
     ...hooks