Skip to content

Commit f3842e7

Browse files
gregbergeclaude
andauthored
Document webframe page and visitor context (#1249)
Document the contextual `state` GitBook injects into an integration block webframe: `state.page` ({ id, path, title }, always available) and `state.visitor` (visitor claims, with the site:visitor:claims scope), and restore the site:visitor:claims scope in the configuration reference. Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
1 parent 17de11e commit f3842e7

4 files changed

Lines changed: 44 additions & 1 deletion

File tree

docs/integrations/configurations.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -98,6 +98,7 @@ The scopes your integration has permissions for.
9898
- site:script:inject ## Internal scope - see note below
9999
- site:script:cookies ## Internal scope - see note below
100100
- site:visitor:auth ## Enable workflows related to authenticated access
101+
- site:visitor:claims ## Expose visitor claims to webframes
101102
- site:adaptive:read ## Read claims available from Adaptive Content
102103
- site:adaptive:write ## Write claims avaiable to Adaptive Content
103104
# OpenAPI

docs/integrations/contentkit/interactivity.md

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -91,6 +91,27 @@ window.addEventListener("message", (event) => {
9191
});
9292
```
9393

94+
## Page and visitor context
95+
96+
GitBook injects contextual information about the current site into the webframe `state`, alongside the values you bind through the `data` prop:
97+
98+
- `state.page` — the current page as `{ id, path, title }`. Always available.
99+
- `state.visitor` — the visitor claims, when the integration has the `site:visitor:claims` [scope](../configurations.md#scopes).
100+
101+
This context is delivered client-side through the same `message` event as your bound `data`, so it does not change how the integration block is cached:
102+
103+
```js
104+
window.addEventListener("message", (event) => {
105+
const state = event.data?.state;
106+
if (!state) return;
107+
108+
if (state.page) {
109+
const { id, path, title } = state.page;
110+
// e.g. build a link to a sibling page from `path`
111+
}
112+
});
113+
```
114+
94115
## Navigating to another page
95116
96117
A webframe can navigate the reader to another page in the site by posting a `@webframe.navigate` action. The `path` is resolved relative to the site root (the part after your site's base URL), so it can point to a page in any section or space of the site, and navigation always stays within it. You can also pass an optional `anchor` to scroll to a heading within the target page:

docs/integrations/development/contentkit/reference.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -264,7 +264,7 @@ If you need a copy button, only add it when your integration has a supported way
264264
| `buttons` | `Array<Button>` | Overlay buttons |
265265
| `data` | `Record<string, string>` | State dependencies |
266266

267-
The `data` values reach the frame through the `message` event as `event.data.state`. A webframe can also navigate the reader to another page in the site by posting a `@webframe.navigate` action with a `path`. See [Interactivity](../../contentkit/interactivity.md#navigating-to-another-page).
267+
The `data` values, together with GitBook-provided context, reach the frame through the `message` event as `event.data.state`. GitBook reserves two keys in `state`: `page` (`{ id, path, title }` of the current page, always available) and `visitor` (visitor claims, with the `site:visitor:claims` scope). A webframe can also navigate the reader to another page in the site by posting a `@webframe.navigate` action with a `path`. See [Interactivity](../../contentkit/interactivity.md#page-and-visitor-context).
268268

269269
#### `select`
270270

docs/integrations/guides/interactivity.md

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -95,6 +95,27 @@ window.addEventListener("message", (event) => {
9595
});
9696
```
9797

98+
### Page and visitor context
99+
100+
GitBook injects contextual information about the current site into the webframe `state`, alongside the values you bind through the `data` prop:
101+
102+
- `state.page` — the current page as `{ id, path, title }`. Always available.
103+
- `state.visitor` — the visitor claims, when the integration has the `site:visitor:claims` [scope](../configurations.md#scopes).
104+
105+
This context is delivered client-side through the same `message` event as your bound `data`, so it does not change how the integration block is cached:
106+
107+
```js
108+
window.addEventListener("message", (event) => {
109+
const state = event.data?.state;
110+
if (!state) return;
111+
112+
if (state.page) {
113+
const { id, path, title } = state.page;
114+
// e.g. build a link to a sibling page from `path`
115+
}
116+
});
117+
```
118+
98119
### Navigating to another page
99120
100121
A webframe can navigate the reader to another page in the site by posting a `@webframe.navigate` action. The `path` is resolved relative to the site root (the part after your site's base URL), so it can point to a page in any section or space of the site, and navigation always stays within it. You can also pass an optional `anchor` to scroll to a heading within the target page:

0 commit comments

Comments
 (0)