@tugitark/react-widget 1.5.4 → 1.5.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.md +20 -4
- package/package.json +2 -2
package/index.md
CHANGED
|
@@ -8,21 +8,37 @@ Also see [the original integration guide](https://www.tugitark.com/chat-setup) f
|
|
|
8
8
|
Minimal Example
|
|
9
9
|
-----------------
|
|
10
10
|
|
|
11
|
-
|
|
11
|
+
To use the Tugi Tark widget on your page, simply call the exported default component. With no parameters given the code will try its upmost to determine the current player and brand, falling back to unauthenticated users when it can't (which will require them to verify their e-mail address and will not provide their profile to the AI Agent).
|
|
12
12
|
|
|
13
13
|
```react
|
|
14
14
|
import TugiWidget from '@tugitark/react-widget';
|
|
15
15
|
|
|
16
|
-
function Component(
|
|
16
|
+
function Component() {
|
|
17
|
+
return (
|
|
18
|
+
<TugiWidget />
|
|
19
|
+
);
|
|
20
|
+
}
|
|
21
|
+
```
|
|
22
|
+
|
|
23
|
+
If your server has the standard `/.tugi` endpoints (as provided by our back-end libraries and documented in our [developer documentation](https://gitlab.com/tugitark/integration/docs)) this is enough to get started with the Tugi Widget. The `/.tugi/jwt/issue` endpoint will be called with no ID given, and if that can return the data for the current player (e.g. from the HTTP session) this is enough. Alternatively you can pass an ID explicitly:
|
|
24
|
+
|
|
25
|
+
```react
|
|
26
|
+
import TugiWidget from '@tugitark/react-widget';
|
|
27
|
+
|
|
28
|
+
interface Props {
|
|
29
|
+
userId: string;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
function Component(props: Props) {
|
|
17
33
|
return (
|
|
18
34
|
<TugiWidget user={props.userId} />
|
|
19
35
|
);
|
|
20
36
|
}
|
|
21
37
|
```
|
|
22
38
|
|
|
23
|
-
|
|
39
|
+
`user` is the ID within your system of the current player. How you determine the current player's unique ID depends entirely on your system and is left as a provided parameter here. This is the ID that the widget will internally pass to the `/.tugi/jwt/issue` endpoint to retrieve the player's profile, and so must in some way identify an end-user on your server.
|
|
24
40
|
|
|
25
|
-
Calls to
|
|
41
|
+
Calls to `<TugiWidget />` are idempotent, if the parameter objects are equivalent. The library will perform deep value comparisons between the parameters of two calls and only act on those that have changed.
|
|
26
42
|
|
|
27
43
|
Custom Example
|
|
28
44
|
----------------
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tugitark/react-widget",
|
|
3
|
-
"version": "1.5.
|
|
3
|
+
"version": "1.5.5",
|
|
4
4
|
"description": "Wraps the tugitark widget in a React component.",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"build": "npx esbuild index.ts --target=es6 --outfile=index.js && sed -i 's/\\bconst\\b/var/g' index.js && sed -i 's/\\blet\\b/var/g' index.js && npx esbuild index.js --allow-overwrite --minify --target=es5 --outfile=index.js && npx tsc --noErrorTruncation --declaration --emitDeclarationOnly --target es6 --module nodenext --moduleResolution nodenext --outDir . index.ts"
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
"index.md"
|
|
13
13
|
],
|
|
14
14
|
"dependencies": {
|
|
15
|
-
"@tugitark/declarative-widget": "^1.3.
|
|
15
|
+
"@tugitark/declarative-widget": "^1.3.5"
|
|
16
16
|
},
|
|
17
17
|
"peerDependencies": {
|
|
18
18
|
"react": ">=0.0.0"
|