@fluxtrace/embed 3.9.0 → 3.9.1
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/README.md +49 -0
- package/package.json +1 -1
package/README.md
ADDED
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
# @fluxtrace/embed
|
|
2
|
+
|
|
3
|
+
Embed a FluxTrace dashboard in any web page with a single custom element.
|
|
4
|
+
|
|
5
|
+
## Install
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install @fluxtrace/embed
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Usage
|
|
12
|
+
|
|
13
|
+
Load the script, then drop the element where you want the dashboard:
|
|
14
|
+
|
|
15
|
+
```html
|
|
16
|
+
<script type="module">
|
|
17
|
+
import "@fluxtrace/embed";
|
|
18
|
+
</script>
|
|
19
|
+
|
|
20
|
+
<fluxtrace-dashboard project-id="YOUR_PROJECT_ID"></fluxtrace-dashboard>
|
|
21
|
+
```
|
|
22
|
+
|
|
23
|
+
The package also ships an IIFE bundle that registers a `FluxtraceEmbed`
|
|
24
|
+
global for use via a plain `<script>` tag.
|
|
25
|
+
|
|
26
|
+
On connect, the element requests a short-lived embed token from your
|
|
27
|
+
FluxTrace web app (`POST <host>/api/embed/token`) and renders the dashboard
|
|
28
|
+
in a lazy-loaded `iframe`.
|
|
29
|
+
|
|
30
|
+
## Attributes
|
|
31
|
+
|
|
32
|
+
| Attribute | Required | Default | Description |
|
|
33
|
+
| ------------ | -------- | --------------------- | ---------------------------------------------------- |
|
|
34
|
+
| `project-id` | yes | — | Project to display. Shows an error note without it. |
|
|
35
|
+
| `host` | no | current origin | FluxTrace web app origin serving `/api/embed/token` |
|
|
36
|
+
| `origin` | no | current origin | Origin sent with the token request |
|
|
37
|
+
| `height` | no | `720px` | Iframe height |
|
|
38
|
+
| `user-id` | no | — | End user the embed is scoped to |
|
|
39
|
+
| `from` | no | — | Start of the displayed range |
|
|
40
|
+
| `to` | no | — | End of the displayed range |
|
|
41
|
+
| `paths` | no | — | Comma-separated page paths to filter by |
|
|
42
|
+
| `ttl` | no | — | Token lifetime in seconds |
|
|
43
|
+
|
|
44
|
+
## Notes
|
|
45
|
+
|
|
46
|
+
- The element registers itself as `fluxtrace-dashboard` exactly once; importing
|
|
47
|
+
the package multiple times is safe.
|
|
48
|
+
- Requires a browser with custom elements support. Nothing renders
|
|
49
|
+
server-side.
|