Add some experimental module interfaces

...with somewhat placeholder names as they're the best I can think of right now:

 * 'Extras': To add new bits of UI to places (specifically the space panel)
 * 'Builtins': For modules to render components that are part of Element Web
 * 'Navigation': For modules to add paths to the URL router
This commit is contained in:
David Baker 2025-09-24 10:58:41 +01:00
parent ac81502c0a
commit 2cd86f7c3d
5 changed files with 51 additions and 0 deletions

View File

@ -0,0 +1,19 @@
/*
Copyright 2025 New Vector Ltd.
SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
Please see LICENSE files in the repository root for full details.
*/
export interface RoomViewProps {
roomId?: string;
}
/**
* Exposes components that are part of Element Web to allow modules to render them
* as part of their custom components (because they can't import the components from
* Element Web since it would cause a dependency cycle)
*/
export interface BuiltinsApi {
getRoomViewComponent(): React.ComponentType<RoomViewProps>;
}

View File

@ -0,0 +1,18 @@
/*
Copyright 2025 New Vector Ltd.
SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
Please see LICENSE files in the repository root for full details.
*/
import { JSX } from "react";
interface SpacePanelItemProps {
isPanelCollapsed: boolean;
}
export type SpacePanelItemRenderFunction = (props: SpacePanelItemProps) => JSX.Element;
export interface ExtrasApi {
addSpacePanelItem(renderer: SpacePanelItemRenderFunction): void;
}

View File

@ -15,6 +15,8 @@ import { NavigationApi } from "./navigation.ts";
import { DialogApiExtension } from "./dialog.ts";
import { AccountAuthApiExtension } from "./auth.ts";
import { ProfileApiExtension } from "./profile.ts";
import { ExtrasApi } from "./extras.ts";
import { BuiltinsApi } from "./builtins.ts";
/**
* Module interface for modules to implement.
@ -103,12 +105,16 @@ export interface Api
*/
readonly customComponents: CustomComponentsApi;
readonly builtins: BuiltinsApi;
/**
* API to navigate the application.
* @public
*/
readonly navigation: NavigationApi;
readonly extras: ExtrasApi;
/**
* Create a ReactDOM root for rendering React components.
* Exposed to allow modules to avoid needing to bundle their own ReactDOM.

View File

@ -5,6 +5,10 @@ SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
Please see LICENSE files in the repository root for full details.
*/
import { JSX } from "react";
export type LocationRenderFunction = () => JSX.Element;
/**
* API methods to navigate the application.
* @public
@ -16,4 +20,6 @@ export interface NavigationApi {
* @param join - If true, the user will be made to attempt to join the room/space if they are not already a member.
*/
toMatrixToLink(link: string, join?: boolean): Promise<void>;
registerLocationRenderer(path: string, renderer: LocationRenderFunction): void;
}

View File

@ -11,10 +11,12 @@ export type { Config, ConfigApi } from "./api/config";
export type { I18nApi, Variables, Translations } from "./api/i18n";
export type * from "./models/event";
export type * from "./api/custom-components";
export type * from "./api/extras";
export type * from "./api/legacy-modules";
export type * from "./api/legacy-customisations";
export type * from "./api/auth";
export type * from "./api/dialog";
export type * from "./api/profile";
export type * from "./api/navigation";
export type * from "./api/builtins";
export * from "./api/watchable";