summaryrefslogtreecommitdiff
path: root/includes/external/matrix/node_modules/matrix-widget-api/README.md
diff options
context:
space:
mode:
Diffstat (limited to 'includes/external/matrix/node_modules/matrix-widget-api/README.md')
-rw-r--r--includes/external/matrix/node_modules/matrix-widget-api/README.md91
1 files changed, 91 insertions, 0 deletions
diff --git a/includes/external/matrix/node_modules/matrix-widget-api/README.md b/includes/external/matrix/node_modules/matrix-widget-api/README.md
new file mode 100644
index 0000000..56bef5f
--- /dev/null
+++ b/includes/external/matrix/node_modules/matrix-widget-api/README.md
@@ -0,0 +1,91 @@
+# matrix-widget-api
+
+![npm](https://img.shields.io/npm/v/matrix-widget-api?style=for-the-badge)
+
+JavaScript/TypeScript SDK for widgets & clients to communicate.
+
+For help and support, visit [#matrix-widgets:matrix.org](https://matrix.to/#/#matrix-widgets:matrix.org) on Matrix.
+
+*Disclaimer: Widgets are not yet in the Matrix spec, so this library may not work with other implementations.*
+
+## Building
+
+To transpile this project to JavaScript, run:
+
+```
+yarn install
+yarn build
+```
+
+## Using the API without a bundler
+
+If you're looking to drop the widget-api into a web browser without the use of a bundler, add a `script`
+tag similar to the following:
+
+```html
+<script src="https://unpkg.com/matrix-widget-api@0.1.0/dist/api.min.js"></script>
+```
+
+Note that the version number may need changing to match the current release.
+
+Once included, the widget-api will be available under `mxwidgets`. For example, `new mxwidgets.WidgetApi(...)`
+to instantiate the `WidgetApi` class.
+
+## Usage for widgets
+
+The general usage for this would be:
+
+```typescript
+const widgetId = null; // if you know the widget ID, supply it.
+const api = new WidgetApi(widgetId);
+
+// Before doing anything else, request capabilities:
+api.requestCapability(MatrixCapabilities.Screenshots);
+api.requestCapabilities(StickerpickerCapabilities);
+
+// Add custom action handlers (if needed)
+api.on(`action:${WidgetApiToWidgetAction.UpdateVisibility}`, (ev: CustomEvent<IVisibilityActionRequest>) => {
+ ev.preventDefault(); // we're handling it, so stop the widget API from doing something.
+ console.log(ev.detail); // custom handling here
+ api.transport.reply(ev.detail, <IWidgetApiRequestEmptyData>{});
+});
+api.on("action:com.example.my_action", (ev: CustomEvent<ICustomActionRequest>) => {
+ ev.preventDefault(); // we're handling it, so stop the widget API from doing something.
+ console.log(ev.detail); // custom handling here
+ api.transport.reply(ev.detail, {custom: "reply"});
+});
+
+// Start the messaging
+api.start();
+
+// If waitForIframeLoad is false, tell the client that we're good to go
+api.sendContentLoaded();
+
+// Later, do something else (if needed)
+api.setAlwaysOnScreen(true);
+api.transport.send("com.example.my_action", {isExample: true});
+```
+
+For a more complete example, see the `examples` directory of this repo.
+
+## Usage for web clients
+
+This SDK is meant for use in browser-based applications. The concepts may be transferable to other platforms,
+though currently this SDK is intended to only be used by browsers. In the future it may be possible for this
+SDK to provide an interface for other platforms.
+
+TODO: Improve this
+
+```typescript
+const driver = new CustomDriver(); // an implementation of WidgetDriver
+const api = new ClientWidgetApi(widget, iframe, driver);
+
+// The API is automatically started, so we just have to wait for a ready before doing something
+api.on("ready", () => {
+ api.updateVisibility(true).then(() => console.log("Widget knows it is visible now"));
+ api.transport.send("com.example.my_action", {isExample: true});
+});
+
+// Eventually, stop the API handling
+api.stop();
+```