Configuration
When initializing Weavy you can pass in various options that affect the behavior of the UIKit and the connected web components.
In the example below we pass in the required url and tokenFactory properties and provide a custom array of emoji for reactions.
Configuring Weavy using Javascript/Typescript
You can configure Weavy using javascript. This provides full configuration possibilities if you want to configure additional functionality such as localization.
const weavy = new Weavy();
weavy.url = "https://myenvironment.weavy.io";
weavy.tokenFactory = async (refresh) => "access_token";
weavy.reactions: ["👍", "❤️", "😂", "😒", "😁"],
Properties
Most properties are optional and/or has sensible default values. Required properties are indicated with an (*).
| Property | Type | Default | Description |
|---|---|---|---|
url* |
string | URL |
The URL to the weavy environment. | |
tokenUrl |
string | URL |
An URL to your own access token endpoint. This enables a default fetching tokenFactory. The endpoint should return JSON encoded access_token and is called with a ?refresh=true query string when a fresh token is needed. |
|
tokenFactory* |
WeavyTokenFactory |
Async function returning an access_token string for your authenticated user. A boolean refresh parameter is provided to let you now if a fresh token is needed from Weavy. |
|
locale |
string |
"en" | Selected locale. The locale must be pre configured in .config.locales. |
locales |
string[] |
Array of enabled locales. The corresponding locales must be available for loading as a locale .js file. | |
localesUrl |
string |
"./locales" | The base url where locale .js files can be found. |
reactions |
string[] |
["😍", "😎", "😉", "😜", "👍"] | An array of unicode emoji for reactions. |
modalParent |
string |
"body" | Element query selector for where to attach modals. Defaults to body but can be optionally be set to html to provide compatibility with some frameworks. Note that any font styles must be provided using :root or html when using the html selector. |
notificationEvents |
boolean |
false |
When true Weavy emits a custom wy:notifications event for realtime updates. |
scrollBehavior |
"smooth" | "instant" | "auto" |
chrome ? "instant" : "smooth" | Which scroll behavior to use (where applicable). Note that not all browsers (Chrome) have similar scroll transitions, they may be very slow. See https://developer.mozilla.org/en-US/docs/Web/API/Element/scroll#behavior |
cloudFilePickerUrl |
string | URL |
"https://filebrowser.weavy.io/v14/" | The url to the cloud file picker. |
Configuring Weavy using plain HTML
To enable and simplify configuration in contexts that has limited javascript functionality, Weavy also provides configuration using a <wy-context></wy-context> Web Component. The standard configuration properties are available, but additional functionality may be limited.
<wy-context url="https://myenvironment.weavy.io" tokenUrl="https://myserver.test/api/token"></wy-context>
...
<h1>Messenger with standard weavy configuration</h1>
<wy-messenger></wy-messenger>
The Weavy Context can be used both by itself and as a standard context provider where you place all the Weavy blocks as children of the Weavy context provider.
<wy-context url="https://myenvironment.weavy.io" tokenUrl="https://myserver.test/api/token">
<h1>Messenger inside a weavy context provider</h1>
<wy-messenger></wy-messenger>
</wy-context>