@snapcall/stream-ui 1.0.0

package/README.md

@@ -0,0 +1,132 @@
+# SnapCall Stream UI
+
+The Stream UI is a library that will help you to quickly integrate [SnapCall](https://www.snapcall.io/) on your application.
+
+## Installation
+
+```
+npm install @snapcall/stream-ui
+```
+
+The NPM package is distributed both as a CommonJS and ES module.
+
+We also distrubute a UMD build of the package, which can be used directly in the browser.
+
+```html
+<script src="https://unpkg.com/@snapcall/stream-ui@latest/dist/stream-ui.umd.js"></script>
+```
+
+## Basic usage
+
+```js
+import { streamUI } from '@snapcall/stream-ui';
+
+const container = document.getElementById('container');
+const roomToken = '123';
+
+streamUI.init({ element: container });
+streamUI.joinRoom(roomToken);
+```
+
+## Methods
+
+### `init(options: InitOptions): void`
+
+Initializes the UI, this function must be called **before** you join a room.
+
+See [InitOptions](#initoptions) for more details.
+
+### `joinRoom(token: string): Promise<void>`
+
+Joins a room.
+
+### `leaveRoom(): void`
+
+Leaves a room.
+
+### `terminateRoom(): void`
+
+Terminates the room, all participants will be disconnected and the room won't be usable anymore.
+
+### `generateToken(buttonId: string): Promise<string>`
+
+Generate a room token with a SnapCall button ID.
+
+## API
+
+### `InitOptions`
+
+```ts
+{
+  element: HTMLElement;
+  sharedURL?: string;
+  audioTiles?: boolean;
+  settingsShortcuts?: string[];
+  controls?: {
+    microphone?: ControlSettings;
+    camera?: ControlSettings;
+    screenshare?: ControlSettings;
+  };
+  showMenuButton?: boolean;
+}
+```
+
+### `element`
+
+##### **Required**
+
+The HTML element where the UI will be rendered.
+
+### `sharedURL`
+
+##### Default value: `window.location.href`
+
+The URL used for features such as "Open new tab" or "QR Code".
+
+### `audioTiles`
+
+##### Default value: `false`
+
+Enable audio-only tiles.
+
+### `settingsShortcuts`
+
+##### Default value: `[]`
+
+Specified options are added as a small shortcut next to the menu button.
+Possible values are: `openNewTab`, `copyLink`, `qrCode`, `settings` and `pip`.
+
+### `controls`
+
+Allows to manage the available and enabled devices
+
+```ts
+type Device = 'microphone' | 'camera' | 'screenshare';
+
+{
+  controls: {
+    <Device>: {
+      available: boolean; // Display or hide the corresponding device button
+      enabled: boolean; // Enable or disable the default state of the device (when entering a room)
+    }
+  }
+}
+```
+
+#### `controls.microphone`
+
+##### Default value: `{ available: true, enabled: true }`
+
+#### `controls.camera`
+
+##### Default value: `{ available: true, enabled: false }`
+
+#### `controls.screenshare`
+
+##### Default value: `{ available: true, enabled: false }`
+
+### `showMenuButton`
+
+##### Default value: `true`
+
+Display or hide the top-right menu button