Set cache-control to no-cache for adaptive content

Co-authored-by: Greg Bergé <berge.greg@gmail.com>

.bun-version

@@ -0,0 +1 @@
+1.1.40

.changeset/blue-baboons-exercise.md

@@ -0,0 +1,5 @@
+---
+'gitbook': minor
+---
+
+Adapt code to pull token from customer backend generated custom cookies

.changeset/honest-teachers-enjoy.md

@@ -0,0 +1,5 @@
+---
+'gitbook': patch
+---
+
+Improve contrast of search box placeholder

.changeset/long-pumpkins-roll.md

@@ -0,0 +1,5 @@
+---
+'gitbook': minor
+---
+
+Track events for site insights using the new dedicated API.

.changeset/mean-pears-live.md

@@ -0,0 +1,5 @@
+---
+'gitbook': patch
+---
+
+Improve colour contrast of list item decoration

.changeset/nasty-apricots-wash.md

@@ -0,0 +1,6 @@
+---
+'@gitbook/react-contentkit': minor
+'gitbook': minor
+---
+
+Send redirectOnError param to getPublishedContent when token is pulled from cookie

.changeset/perfect-boxes-grow.md

@@ -0,0 +1,5 @@
+---
+'gitbook': patch
+---
+
+Fix emojis display

.changeset/serious-dancers-clean.md

@@ -0,0 +1,5 @@
+---
+'gitbook': patch
+---
+
+Fix variant selector contrast for non-default themes

.changeset/shiny-seahorses-explode.md

@@ -0,0 +1,5 @@
+---
+'@gitbook/react-openapi': patch
+---
+
+Updated scalar depdenency

.changeset/thick-ears-reply.md

@@ -0,0 +1,5 @@
+---
+'gitbook': patch
+---
+
+Fix bullet list display on full size blocks

.github/composite/setup-bun/action.yaml

@@ -0,0 +1,18 @@
+name: 'Setup Bun'
+description: 'Install Bun and cache dependencies'
+runs:
+    using: 'composite'
+    steps:
+        # We cache dependencies even if Bun is fast to avoid downloading fontawesome too many times
+        # and impacting bandwidth there.
+        - name: Cache bun
+          uses: actions/cache@v4
+          with:
+              path: ~/.bun/install/cache
+              key: ${{ runner.os }}-bun-${{ hashFiles('**/bun.lockb') }}-${{ hashFiles('**/bun.lock') }}
+              restore-keys: |
+                  ${{ runner.os }}-bun-
+        - name: Setup bun
+          uses: oven-sh/setup-bun@v2
+          with:
+              bun-version-file: '.bun-version'

.github/workflows/ci.yaml

@@ -5,7 +5,7 @@ on:
         branches:
             - main
 env:
-    NPMRC_FONT_AWESOME_TOKEN: ${{ secrets.NPMRC_FONT_AWESOME_TOKEN }}
+    NPM_TOKEN_READONLY: ${{ secrets.NPM_TOKEN_READONLY }}
 jobs:
     deploy:
         name: Deploy to Cloudflare Pages
@@ -22,10 +22,8 @@ jobs:
         steps:
             - name: Checkout
               uses: actions/checkout@v4
-            - name: Setup bun
+            - name: Setup Bun
-              uses: oven-sh/setup-bun@v1
+              uses: ./.github/composite/setup-bun
-              with:
-                  bun-version: 1.1.18
             - name: Install dependencies
               run: bun install --frozen-lockfile
               env:
@@ -102,10 +100,8 @@ jobs:
         steps:
             - name: Checkout
               uses: actions/checkout@v4
-            - name: Setup bun
+            - name: Setup Bun
-              uses: oven-sh/setup-bun@v1
+              uses: ./.github/composite/setup-bun
-              with:
-                  bun-version: 1.1.18
             - name: Install dependencies
               run: bun install --frozen-lockfile
             - name: Setup Playwright
@@ -128,10 +124,8 @@ jobs:
         steps:
             - name: Checkout
               uses: actions/checkout@v4
-            - name: Setup bun
+            - name: Setup Bun
-              uses: oven-sh/setup-bun@v1
+              uses: ./.github/composite/setup-bun
-              with:
-                  bun-version: 1.1.18
             - name: Install dependencies
               run: bun install --frozen-lockfile
               env:
@@ -147,10 +141,8 @@ jobs:
         steps:
             - name: Checkout
               uses: actions/checkout@v4
-            - name: Setup bun
+            - name: Setup Bun
-              uses: oven-sh/setup-bun@v1
+              uses: ./.github/composite/setup-bun
-              with:
-                  bun-version: 1.1.18
             - name: Install dependencies
               run: bun install --frozen-lockfile
               env:
@@ -162,10 +154,8 @@ jobs:
         steps:
             - name: Checkout
               uses: actions/checkout@v4
-            - name: Setup bun
+            - name: Setup Bun
-              uses: oven-sh/setup-bun@v1
+              uses: ./.github/composite/setup-bun
-              with:
-                  bun-version: 1.1.18
             - name: Install dependencies
               run: bun install --frozen-lockfile
               env:
@@ -177,10 +167,8 @@ jobs:
         steps:
             - name: Checkout
               uses: actions/checkout@v4
-            - name: Setup bun
+            - name: Setup Bun
-              uses: oven-sh/setup-bun@v1
+              uses: ./.github/composite/setup-bun
-              with:
-                  bun-version: 1.1.18
             - name: Install dependencies
               run: bun install --frozen-lockfile
               env:
@@ -191,16 +179,14 @@ jobs:
         runs-on: ubuntu-latest
         name: Build (Open Source)
         env:
-            NPMRC_FONT_AWESOME_TOKEN: ''
+            NPM_TOKEN_READONLY: ''
         steps:
             - name: Checkout
               uses: actions/checkout@v4
-            - name: Setup bun
+            - name: Setup Bun
-              uses: oven-sh/setup-bun@v1
+              uses: ./.github/composite/setup-bun
-              with:
-                  bun-version: 1.1.18
             - name: Install dependencies
-              run: bun install --frozen-lockfile
+              run: bun install
               env:
                   PUPPETEER_SKIP_DOWNLOAD: 1
             - run: bun run build
@@ -210,10 +196,8 @@ jobs:
         steps:
             - name: Checkout
               uses: actions/checkout@v4
-            - name: Setup bun
+            - name: Setup Bun
-              uses: oven-sh/setup-bun@v1
+              uses: ./.github/composite/setup-bun
-              with:
-                  bun-version: 1.1.18
             - name: Install dependencies
               run: bun install --frozen-lockfile
               env:

.github/workflows/publish.yaml

@@ -17,10 +17,8 @@ jobs:
               with:
                   # This makes Actions fetch all Git history so that Changesets can generate changelogs with the correct commits
                   fetch-depth: 0
-            - name: Setup bun
+            - name: Setup Bun
-              uses: oven-sh/setup-bun@v1
+              uses: ./.github/composite/setup-bun
-              with:
-                  bun-version: 1.1.18
             - name: Install dependencies
               run: bun install --frozen-lockfile
               env:
@@ -34,7 +32,7 @@ jobs:
                   # Using a PAT instead of GITHUB_TOKEN because we need to run workflows when releases are created
                   # https://github.com/orgs/community/discussions/26875#discussioncomment-3253761
                   GITHUB_TOKEN: ${{ secrets.GH_PERSONAL_TOKEN }}
-                  NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+                  NPM_TOKEN_READONLY: ${{ secrets.NPM_TOKEN_READONLY }}
                   CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
                   CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
     release-preview:
@@ -45,10 +43,8 @@ jobs:
         steps:
             - name: Checkout Repo
               uses: actions/checkout@v3
-            - name: Setup bun
+            - name: Setup Bun
-              uses: oven-sh/setup-bun@v1
+              uses: ./.github/composite/setup-bun
-              with:
-                  bun-version: 1.1.18
             - name: Install dependencies
               run: bun install --frozen-lockfile
               env:

bunfig.toml

@@ -1,2 +1,2 @@
 [install.scopes]
-"awesome.me" = { token = "$NPMRC_FONT_AWESOME_TOKEN", url = "https://npm.fontawesome.com/" }
+"gitbook" = { token = "$NPM_TOKEN_READONLY", url = "https://registry.npmjs.org" }

packages/gitbook/e2e/pages.spec.ts

@@ -6,20 +6,29 @@ import {
     CustomizationHeaderPreset,
     CustomizationIconsStyle,
     CustomizationLocale,
+    CustomizationSidebarBackgroundStyle,
+    CustomizationSidebarListStyle,
     CustomizationThemeMode,
     SiteCustomizationSettings,
 } from '@gitbook/api';
-import { test, expect, Page } from '@playwright/test';
+import { test, expect, Page, BrowserContext } from '@playwright/test';
 import deepMerge from 'deepmerge';
 import jwt from 'jsonwebtoken';
 import rison from 'rison';
 import { DeepPartial } from 'ts-essentials';
 
+import {
+    getVisitorAuthCookieName,
+    getVisitorAuthCookieValue,
+    VISITOR_TOKEN_COOKIE,
+} from '@/lib/visitor-token';
+
 import { getContentTestURL } from '../tests/utils';
 
 interface Test {
     name: string;
     url: string; // URL to visit for testing
+    cookies?: Parameters<BrowserContext['addCookies']>[0];
     run?: (page: Page) => Promise<unknown>; // The test to run
     fullPage?: boolean; // Whether the test should be fullscreened during testing
     screenshot?: false; // Should a screenshot be stored
@@ -867,6 +876,60 @@ const testCases: TestsCase[] = [
             },
         ],
     },
+    {
+        name: 'Visitor Auth - Site (redirects to fallback/auth URL)',
+        baseUrl: `https://gitbook-open-e2e-sites.gitbook.io/va-site-redirects-fallback/`,
+        tests: [
+            {
+                name: 'Redirect to fallback on invalid token pulled from cookie',
+                url: '',
+                screenshot: false,
+                cookies: (() => {
+                    const basePath = '/va-site-redirects-fallback/';
+                    const invalidToken = jwt.sign(
+                        {
+                            name: 'gitbook-open-tests',
+                        },
+                        'invalidKey',
+                        {
+                            expiresIn: '24h',
+                        },
+                    );
+                    return [
+                        {
+                            name: getVisitorAuthCookieName(basePath),
+                            value: getVisitorAuthCookieValue(basePath, invalidToken),
+                            httpOnly: true,
+                        },
+                    ];
+                })(),
+                run: async (page) => {
+                    await expect(page).toHaveURL(/https:\/\/www.google.com/);
+                },
+            },
+            {
+                name: 'Show error message when invalid token is passed to url',
+                screenshot: false,
+                url: (() => {
+                    const token = jwt.sign(
+                        {
+                            name: 'gitbook-open-tests',
+                        },
+                        'invalidKey',
+                        {
+                            expiresIn: '24h',
+                        },
+                    );
+                    return `?jwt_token=${token}`;
+                })(),
+                run: async (page) => {
+                    await expect(page.locator('pre')).toContainText(
+                        'Error while validating the JWT token. Reason: The token signature is invalid.',
+                    );
+                },
+            },
+        ],
+    },
     {
         name: 'Languages',
         baseUrl: 'https://gitbook.gitbook.io/test-gitbook-open/',
@@ -1022,6 +1085,149 @@ const testCases: TestsCase[] = [
             },
         ],
     },
+    {
+        name: 'Adaptive Content - Public',
+        baseUrl: `https://gitbook-open-e2e-sites.gitbook.io/adaptive-content-public/`,
+        tests: [
+            {
+                name: 'No custom cookie',
+                url: '',
+                run: async (page) => {
+                    const welcomePage = page
+                        .locator('a[class*="group\\/toclink"]')
+                        .filter({ hasText: 'Welcome Page' });
+                    const alphaUserPage = page
+                        .locator('a[class*="group\\/toclink"]')
+                        .filter({ hasText: 'Alpha User' });
+                    const betaUserPage = page
+                        .locator('a[class*="group\\/toclink"]')
+                        .filter({ hasText: 'Beta User' });
+
+                    await expect(welcomePage).toBeVisible();
+                    await expect(alphaUserPage).toHaveCount(0);
+                    await expect(betaUserPage).toHaveCount(0);
+                },
+            },
+            {
+                name: 'Custom cookie with isAlphaUser claim',
+                cookies: (() => {
+                    const privateKey = '4ddd3c2f-e4b7-4e73-840b-526c3be19746';
+                    const token = jwt.sign(
+                        {
+                            name: 'gitbook-open-tests',
+                            isAlphaUser: true,
+                        },
+                        privateKey,
+                        {
+                            expiresIn: '24h',
+                        },
+                    );
+                    return [
+                        {
+                            name: VISITOR_TOKEN_COOKIE,
+                            value: token,
+                            httpOnly: true,
+                        },
+                    ];
+                })(),
+                url: '',
+                run: async (page) => {
+                    const welcomePage = page
+                        .locator('a[class*="group\\/toclink"]')
+                        .filter({ hasText: 'Welcome Page' });
+                    const alphaUserPage = page
+                        .locator('a[class*="group\\/toclink"]')
+                        .filter({ hasText: 'Alpha User' });
+                    const betaUserPage = page
+                        .locator('a[class*="group\\/toclink"]')
+                        .filter({ hasText: 'Beta User' });
+
+                    await expect(welcomePage).toBeVisible();
+                    await expect(alphaUserPage).toBeVisible();
+                    await expect(betaUserPage).toHaveCount(0);
+                },
+            },
+            {
+                name: 'Custom cookie with isBetaUser claim',
+                cookies: (() => {
+                    const privateKey = '4ddd3c2f-e4b7-4e73-840b-526c3be19746';
+                    const token = jwt.sign(
+                        {
+                            name: 'gitbook-open-tests',
+                            isBetaUser: true,
+                        },
+                        privateKey,
+                        {
+                            expiresIn: '24h',
+                        },
+                    );
+                    return [
+                        {
+                            name: VISITOR_TOKEN_COOKIE,
+                            value: token,
+                            httpOnly: true,
+                        },
+                    ];
+                })(),
+                url: '',
+                run: async (page) => {
+                    const welcomePage = page
+                        .locator('a[class*="group\\/toclink"]')
+                        .filter({ hasText: 'Welcome Page' });
+                    const alphaUserPage = page
+                        .locator('a[class*="group\\/toclink"]')
+                        .filter({ hasText: 'Alpha User' });
+                    const betaUserPage = page
+                        .locator('a[class*="group\\/toclink"]')
+                        .filter({ hasText: 'Beta User' });
+
+                    await expect(welcomePage).toBeVisible();
+                    await expect(betaUserPage).toBeVisible();
+                    await expect(alphaUserPage).toHaveCount(0);
+                },
+            },
+            {
+                name: 'Custom cookie with isAlphaUser & isBetaUser claims',
+                cookies: (() => {
+                    const privateKey = '4ddd3c2f-e4b7-4e73-840b-526c3be19746';
+                    const token = jwt.sign(
+                        {
+                            name: 'gitbook-open-tests',
+                            isAlphaUser: true,
+                            isBetaUser: true,
+                        },
+                        privateKey,
+                        {
+                            expiresIn: '24h',
+                        },
+                    );
+                    return [
+                        {
+                            name: VISITOR_TOKEN_COOKIE,
+                            value: token,
+                            httpOnly: true,
+                        },
+                    ];
+                })(),
+                url: '',
+                run: async (page) => {
+                    const welcomePage = page
+                        .locator('a[class*="group\\/toclink"]')
+                        .filter({ hasText: 'Welcome Page' });
+                    const alphaUserPage = page
+                        .locator('a[class*="group\\/toclink"]')
+                        .filter({ hasText: 'Alpha User' });
+                    const betaUserPage = page
+                        .locator('a[class*="group\\/toclink"]')
+                        .filter({ hasText: 'Beta User' });
+
+                    await expect(welcomePage).toBeVisible();
+                    await expect(betaUserPage).toBeVisible();
+                    await expect(alphaUserPage).toBeVisible();
+                },
+            },
+        ],
+    },
     {
         name: 'Tables',
         baseUrl: 'https://gitbook.gitbook.io/test-gitbook-open/',
@@ -1112,9 +1318,18 @@ for (const testCase of testCases) {
     test.describe(testCase.name, () => {
         for (const testEntry of testCase.tests) {
             const testFn = testEntry.only ? test.only : test;
-            testFn(testEntry.name, async ({ page, baseURL }) => {
+            testFn(testEntry.name, async ({ page, baseURL, context }) => {
                 const contentUrl = new URL(testEntry.url, testCase.baseUrl);
                 const url = getContentTestURL(contentUrl.toString(), baseURL);
+                if (testEntry.cookies) {
+                    await context.addCookies(
+                        testEntry.cookies.map((cookie) => ({
+                            ...cookie,
+                            domain: new URL(url).host,
+                            path: '/',
+                        })),
+                    );
+                }
                 await page.goto(url);
                 if (testEntry.run) {
                     await testEntry.run(page);
@@ -1152,6 +1367,10 @@ function getCustomizationURL(partial: DeepPartial<SiteCustomizationSettings>): s
             font: CustomizationFont.Inter,
             background: CustomizationBackground.Plain,
             icons: CustomizationIconsStyle.Regular,
+            sidebar: {
+                background: CustomizationSidebarBackgroundStyle.Default,
+                list: CustomizationSidebarListStyle.Default,
+            },
         },
         internationalization: {
             locale: CustomizationLocale.En,

packages/gitbook/package.json

@@ -16,7 +16,7 @@
         "clean": "rm -rf ./.next && rm -rf ./public/~gitbook/static"
     },
     "dependencies": {
-        "@gitbook/api": "^0.81.0",
+        "@gitbook/api": "^0.84.0",
         "@gitbook/cache-do": "workspace:*",
         "@gitbook/emoji-codepoints": "workspace:*",
         "@gitbook/icons": "workspace:*",
@@ -43,7 +43,7 @@
         "memoizee": "^0.4.15",
         "next": "14.2.15",
         "next-themes": "^0.2.1",
-        "nuqs": "^1.17.4",
+        "nuqs": "^2.2.3",
         "object-hash": "^3.0.0",
         "openapi-types": "^12.1.3",
         "p-map": "^7.0.0",
@@ -64,7 +64,8 @@
         "tailwind-merge": "^2.2.0",
         "tailwind-shades": "^1.1.2",
         "unified": "^11.0.4",
-        "url-join": "^5.0.0"
+        "url-join": "^5.0.0",
+        "usehooks-ts": "^3.1.0"
     },
     "devDependencies": {
         "@argos-ci/playwright": "^2.0.0",

packages/gitbook/src/app/(site)/(content)/[[...pathname]]/not-found.tsx

@@ -1,11 +1,15 @@
+import { TrackPageViewEvent } from '@/components/Insights';
 import { getSpaceLanguage, t } from '@/intl/server';
-import { getSiteData } from '@/lib/api';
+import { getSiteData, getSpaceContentData } from '@/lib/api';
 import { getSiteContentPointer } from '@/lib/pointer';
 import { tcls } from '@/lib/tailwind';
 
 export default async function NotFound() {
     const pointer = getSiteContentPointer();
-    const { customization } = await getSiteData(pointer);
+    const [{ space }, { customization }] = await Promise.all([
+        getSpaceContentData(pointer, pointer.siteShareKey),
+        getSiteData(pointer),
+    ]);
 
     const language = getSpaceLanguage(customization);
 
@@ -19,6 +23,9 @@ export default async function NotFound() {
                 </h2>
                 <p className={tcls('text-base', 'mb-4')}>{t(language, 'notfound')}</p>
             </div>
+
+            {/* Track the page not found as a page view */}
+            <TrackPageViewEvent pageId={null} revisionId={space.revision} />
         </div>
     );
 }

packages/gitbook/src/app/(site)/(content)/[[...pathname]]/page.tsx

@@ -9,7 +9,6 @@ import { PageHrefContext, absoluteHref, pageHref } from '@/lib/links';
 import { getPagePath, resolveFirstDocument } from '@/lib/pages';
 import { ContentRefContext } from '@/lib/references';
 import { isSpaceIndexable, isPageIndexable } from '@/lib/seo';
-import { tcls } from '@/lib/tailwind';
 import { getContentTitle } from '@/lib/utils';
 
 import { PageClientLayout } from './PageClientLayout';

packages/gitbook/src/app/(site)/(content)/layout.tsx

@@ -1,6 +1,7 @@
 import { CustomizationThemeMode } from '@gitbook/api';
 import { Metadata, Viewport } from 'next';
 import { headers } from 'next/headers';
+import { NuqsAdapter } from 'nuqs/adapters/next/app';
 import React from 'react';
 import * as ReactDOM from 'react-dom';
 
@@ -55,46 +56,48 @@ export default async function ContentLayout(props: { children: React.ReactNode }
     });
 
     return (
-        <ClientContexts
+        <NuqsAdapter>
-            nonce={nonce}
+            <ClientContexts
-            forcedTheme={
+                nonce={nonce}
-                getQueryStringTheme() ??
+                forcedTheme={
-                (customization.themes.toggeable ? undefined : customization.themes.default)
+                    getQueryStringTheme() ??
-            }
+                    (customization.themes.toggeable ? undefined : customization.themes.default)
-        >
+                }
-            <SpaceLayout
-                space={space}
-                contentTarget={contentTarget}
-                site={site}
-                spaces={spaces}
-                sections={sections}
-                customization={customization}
-                pages={pages}
-                ancestors={ancestors}
-                content={content}
             >
-                {children}
+                <SpaceLayout
-            </SpaceLayout>
+                    space={space}
+                    contentTarget={contentTarget}
+                    site={site}
+                    spaces={spaces}
+                    sections={sections}
+                    customization={customization}
+                    pages={pages}
+                    ancestors={ancestors}
+                    content={content}
+                >
+                    {children}
+                </SpaceLayout>
 
-            {scripts.length > 0 ? (
+                {scripts.length > 0 ? (
-                <>
+                    <>
-                    <LoadIntegrations />
+                        <LoadIntegrations />
-                    {scripts.map(({ script }) => (
+                        {scripts.map(({ script }) => (
-                        <script key={script} async src={script} nonce={nonce} />
+                            <script key={script} async src={script} nonce={nonce} />
-                    ))}
+                        ))}
-                </>
+                    </>
-            ) : null}
+                ) : null}
 
-            {scripts.some((script) => script.cookies) || customization.privacyPolicy.url ? (
+                {scripts.some((script) => script.cookies) || customization.privacyPolicy.url ? (
-                <React.Suspense fallback={null}>
+                    <React.Suspense fallback={null}>
-                    <CookiesToast privacyPolicy={customization.privacyPolicy.url} />
+                        <CookiesToast privacyPolicy={customization.privacyPolicy.url} />
-                </React.Suspense>
+                    </React.Suspense>
-            ) : null}
+                ) : null}
 
-            <RocketLoaderDetector nonce={nonce} />
+                <RocketLoaderDetector nonce={nonce} />
 
-            <AdminToolbar space={space} content={content} />
+                <AdminToolbar space={space} content={content} />
-        </ClientContexts>
+            </ClientContexts>
+        </NuqsAdapter>
     );
 }
 

packages/gitbook/src/components/Cookies/CookiesToast.tsx

@@ -6,9 +6,10 @@ import * as React from 'react';
 import { Button } from '@/components/primitives';
 import { useLanguage } from '@/intl/client';
 import { t, tString } from '@/intl/translate';
-import { isCookiesTrackingDisabled, setCookiesTracking } from '@/lib/analytics';
 import { tcls } from '@/lib/tailwind';
 
+import { isCookiesTrackingDisabled, setCookiesTracking } from '../Insights';
+
 /**
  * Toast to accept or reject the use of cookies.
  */

packages/gitbook/src/components/DocumentView/ListItem.tsx

@@ -38,6 +38,8 @@ export function ListItem(props: BlockProps<DocumentBlockListItem>) {
                 '[&:is(h2)>div]:mt-0',
                 '[&:is(h3)>div]:mt-0',
                 '[&:is(h4)>div]:mt-0',
+                // Override the "mx-auto" class from UnwrappedBlocks
+                'mx-0',
             )}
             style="space-y-2 flex flex-col flex-1"
         />
@@ -135,7 +137,7 @@ function ListItemPrefix(props: { block: DocumentBlockListItem; children: React.R
             className={tcls(
                 textStyle.textSize,
                 textStyle.lineHeight,
-                'flex items-center justify-center mr-1 min-h-[1lh] min-w-6 text-dark/6 dark:text-light/5',
+                'flex items-center justify-center mr-1 min-h-[1lh] min-w-6 text-dark-4 dark:text-light-4',
             )}
         >
             {props.children}

packages/gitbook/src/components/Header/Header.tsx

@@ -95,7 +95,25 @@ export function Header(props: {
                             <HeaderLogo site={site} space={space} customization={customization} />
                             {!hasSiteSections && isMultiVariants ? (
                                 <div className="z-20 shrink hidden sm:block">
-                                    <SpacesDropdown space={space} spaces={spaces} />
+                                    <SpacesDropdown
+                                        className={tcls(
+                                            !isCustomizationDefault &&
+                                                withTopHeader && [
+                                                    'bg-header-link/2',
+                                                    'dark:bg-header-link/2',
+                                                    'text-header-link/8',
+                                                    'dark:text-header-link/8',
+                                                    'ring-1',
+                                                    'ring-header-link/4',
+                                                    'dark:ring-header-link/4',
+                                                    'contrast-more:bg-header-background',
+                                                    'contrast-more:text-header-link',
+                                                    'contrast-more:ring-header-link',
+                                                ],
+                                        )}
+                                        space={space}
+                                        spaces={spaces}
+                                    />
                                 </div>
                             ) : null}
                         </div>

packages/gitbook/src/components/Insights/InsightsProvider.tsx

@@ -0,0 +1,200 @@
+'use client';
+
+import type * as api from '@gitbook/api';
+import cookies from 'js-cookie';
+import * as React from 'react';
+import { useEventCallback, useDebounceCallback } from 'usehooks-ts';
+
+import { getSession } from './sessions';
+import { getVisitorId } from './visitorId';
+
+interface InsightsEventContext {
+    organizationId: string;
+    siteId: string;
+    siteSectionId: string | undefined;
+    siteSpaceId: string | undefined;
+    spaceId: string;
+    siteShareKey: string | undefined;
+}
+
+interface InsightsEventPageContext {
+    pageId: string | null;
+    revisionId: string;
+}
+
+type SiteEventName = api.SiteInsightsEvent['type'];
+
+type TrackEventInput<EventName extends SiteEventName> = { type: EventName } & Omit<
+    Extract<api.SiteInsightsEvent, { type: EventName }>,
+    'location' | 'session'
+>;
+
+type TrackEventCallback = <EventName extends SiteEventName>(
+    event: TrackEventInput<EventName>,
+    ctx?: InsightsEventPageContext,
+) => void;
+
+const InsightsContext = React.createContext<TrackEventCallback | null>(null);
+
+interface InsightsProviderProps extends InsightsEventContext {
+    enabled: boolean;
+    apiHost: string;
+    children: React.ReactNode;
+}
+
+/**
+ * Wrap the content of the app with the InsightsProvider to track events.
+ */
+export function InsightsProvider(props: InsightsProviderProps) {
+    const { enabled, apiHost, children, ...context } = props;
+
+    const eventsRef = React.useRef<{
+        [pathname: string]:
+            | {
+                  url: string;
+                  events: TrackEventInput<SiteEventName>[];
+                  context: InsightsEventContext;
+                  pageContext?: InsightsEventPageContext;
+              }
+            | undefined;
+    }>({});
+
+    const flushEvents = useDebounceCallback(async (pathname: string) => {
+        const visitorId = await getVisitorId();
+        const session = await getSession();
+
+        const eventsForPathname = eventsRef.current[pathname];
+        if (!eventsForPathname || !eventsForPathname.pageContext) {
+            console.warn('No events to flush', eventsForPathname);
+            return;
+        }
+
+        const events = transformEvents({
+            url: eventsForPathname.url,
+            events: eventsForPathname.events,
+            context,
+            pageContext: eventsForPathname.pageContext,
+            visitorId,
+            sessionId: session.id,
+        });
+
+        // Reset the events for the next flush
+        eventsRef.current[pathname] = {
+            ...eventsForPathname,
+            events: [],
+        };
+
+        if (enabled) {
+            console.log('Sending events', events);
+            await sendEvents({
+                apiHost,
+                organizationId: context.organizationId,
+                siteId: context.siteId,
+                events,
+            });
+        } else {
+            console.log('Events not sent', events);
+        }
+    }, 500);
+
+    const trackEvent = useEventCallback(
+        (event: TrackEventInput<SiteEventName>, ctx?: InsightsEventPageContext) => {
+            console.log('Logging event', event, ctx);
+
+            const pathname = window.location.pathname;
+            const previous = eventsRef.current[pathname];
+            eventsRef.current[pathname] = {
+                pageContext: previous?.pageContext ?? ctx,
+                url: previous?.url ?? window.location.href,
+                events: [...(previous?.events ?? []), event],
+                context,
+            };
+
+            if (eventsRef.current[pathname].pageContext !== undefined) {
+                // If the pageId is set, we know that the page_view event has been tracked
+                // and we can flush the events
+                flushEvents(pathname);
+            }
+        },
+    );
+
+    return <InsightsContext.Provider value={trackEvent}>{props.children}</InsightsContext.Provider>;
+}
+
+/**
+ * Get a callback to track an event.
+ */
+export function useTrackEvent(): TrackEventCallback {
+    const trackEvent = React.useContext(InsightsContext);
+    if (!trackEvent) {
+        throw new Error('useTrackEvent must be used within an InsightsProvider');
+    }
+
+    return trackEvent;
+}
+
+/**
+ * Post the events to the server.
+ */
+async function sendEvents(args: {
+    apiHost: string;
+    organizationId: string;
+    siteId: string;
+    events: api.SiteInsightsEvent[];
+}) {
+    const { apiHost, organizationId, siteId, events } = args;
+    const url = new URL(apiHost);
+    url.pathname = `/v1/orgs/${organizationId}/sites/${siteId}/insights/events`;
+
+    await fetch(url, {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({
+            events,
+        }),
+    });
+}
+
+/**
+ * Transform the events to the format expected by the API.
+ */
+function transformEvents(input: {
+    url: string;
+    events: TrackEventInput<SiteEventName>[];
+    context: InsightsEventContext;
+    pageContext: InsightsEventPageContext;
+    visitorId: string;
+    sessionId: string;
+}): api.SiteInsightsEvent[] {
+    const session: api.SiteInsightsEventSession = {
+        sessionId: input.sessionId,
+        visitorId: input.visitorId,
+        userAgent: window.navigator.userAgent,
+        language: window.navigator.language,
+        cookies: cookies.get(),
+        referrer: document.referrer || null,
+    };
+
+    const location: api.SiteInsightsEventLocation = {
+        url: input.url,
+        siteSection: input.context.siteSectionId ?? null,
+        siteSpace: input.context.siteSpaceId ?? null,
+        space: input.context.spaceId,
+        siteShareKey: input.context.siteShareKey ?? null,
+        page: input.pageContext.pageId,
+        revision: input.pageContext.revisionId,
+    };
+
+    return input.events.map((partialEvent) => {
+        // @ts-expect-error: Partial event
+        const event: api.SiteInsightsEvent = {
+            ...partialEvent,
+            session,
+            location,
+        };
+
+        return event;
+    });
+}

packages/gitbook/src/components/Insights/TrackPageViewEvent.tsx

@@ -0,0 +1,27 @@
+'use client';
+
+import * as React from 'react';
+
+import { useTrackEvent } from './InsightsProvider';
+
+/**
+ * Track a page view event.
+ */
+export function TrackPageViewEvent(props: { pageId: string | null; revisionId: string }) {
+    const { pageId, revisionId } = props;
+    const trackEvent = useTrackEvent();
+
+    React.useEffect(() => {
+        trackEvent(
+            {
+                type: 'page_view',
+            },
+            {
+                pageId,
+                revisionId,
+            },
+        );
+    }, [pageId, revisionId, trackEvent]);
+
+    return null;
+}

packages/gitbook/src/components/Insights/cookies.ts

@@ -0,0 +1,32 @@
+'use client';
+
+import cookies from 'js-cookie';
+
+const GRANTED_COOKIE = '__gitbook_cookie_granted';
+
+/**
+ * Accept or reject cookies.
+ */
+export function setCookiesTracking(enabled: boolean) {
+    cookies.set(GRANTED_COOKIE, enabled ? 'yes' : 'no', {
+        expires: 365,
+        sameSite: 'none',
+        secure: true,
+    });
+}
+
+/**
+ * Return true if cookies are accepted or not.
+ * Return `undefined` if state is not known.
+ */
+export function isCookiesTrackingDisabled() {
+    const state = cookies.get(GRANTED_COOKIE);
+
+    if (state === 'yes') {
+        return false;
+    } else if (state === 'no') {
+        return true;
+    }
+
+    return undefined;
+}

packages/gitbook/src/components/Insights/index.ts

@@ -0,0 +1,4 @@
+export * from './InsightsProvider';
+export * from './visitorId';
+export * from './cookies';
+export * from './TrackPageViewEvent';

packages/gitbook/src/components/Insights/sessions.ts

@@ -0,0 +1,71 @@
+'use client';
+
+import { generateRandomId } from './utils';
+
+const SESSION_TTL = 1000 * 60 * 30; // 30 minutes
+
+interface Session {
+    id: string;
+    lastActiveAt: number;
+}
+
+let currentSession: Session | null = null;
+
+const SESSION_KEY = '__gitbook_session';
+
+/**
+ * Get the current session.
+ */
+export function getSession(): Session {
+    if (currentSession) {
+        return currentSession;
+    }
+
+    try {
+        const rawSession =
+            typeof localStorage !== 'undefined' ? localStorage.getItem(SESSION_KEY) : null;
+
+        if (rawSession) {
+            const storedSession = JSON.parse(rawSession);
+
+            if (
+                typeof storedSession === 'object' &&
+                typeof storedSession.lastActiveAt === 'number' &&
+                typeof storedSession.id === 'string' &&
+                storedSession.lastActiveAt + SESSION_TTL > Date.now()
+            ) {
+                currentSession = storedSession as Session;
+                touchSession();
+                return currentSession;
+            }
+        }
+    } catch (error) {
+        console.error('Error parsing session', error);
+    }
+
+    currentSession = {
+        id: generateRandomId(),
+        lastActiveAt: Date.now(),
+    };
+    saveSession();
+    return currentSession;
+}
+
+/**
+ * Update the session.
+ */
+export function touchSession() {
+    if (currentSession) {
+        currentSession.lastActiveAt = Date.now();
+        saveSession();
+    }
+}
+
+/**
+ * Save the session to the local storage.
+ */
+export function saveSession() {
+    if (typeof localStorage !== 'undefined' && currentSession) {
+        localStorage.setItem(SESSION_KEY, JSON.stringify(currentSession));
+    }
+}

packages/gitbook/src/components/Insights/utils.ts

@@ -0,0 +1,11 @@
+/**
+ * Generate a random ID.
+ */
+export function generateRandomId(): string {
+    if (typeof crypto !== 'undefined' && crypto.randomUUID) {
+        return `${crypto.randomUUID()}R`;
+    }
+
+    // Fallback for old browsers
+    return `${Math.random().toString(36).substring(2)}R`;
+}

packages/gitbook/src/components/Insights/visitorId.ts

@@ -0,0 +1,68 @@
+'use client';
+
+import cookies from 'js-cookie';
+
+import { isCookiesTrackingDisabled } from './cookies';
+import { generateRandomId } from './utils';
+
+const VISITORID_COOKIE = '__session';
+
+let visitorId: string | null = null;
+let pendingVisitorId: Promise<string> | null = null;
+
+/**
+ * Return the current visitor identifier.
+ */
+export async function getVisitorId(): Promise<string> {
+    if (!visitorId) {
+        if (!pendingVisitorId) {
+            pendingVisitorId = fetchVisitorID().finally(() => {
+                pendingVisitorId = null;
+            });
+        }
+
+        visitorId = await pendingVisitorId;
+    }
+
+    return visitorId;
+}
+
+/**
+ * Propose a visitor identifier to the GitBook.com server and get the devideId back.
+ */
+async function fetchVisitorID(): Promise<string> {
+    const withoutCookies = isCookiesTrackingDisabled();
+
+    if (withoutCookies) {
+        return generateRandomId();
+    }
+
+    const existingTrackingCookie = cookies.get(VISITORID_COOKIE);
+
+    if (existingTrackingCookie) {
+        // If the cookie already exists, we'll just use that. Avoids a server request.
+        return existingTrackingCookie;
+    } else {
+        // No tracking deviceId set, we'll need to consolidate with the server.
+        const proposed = generateRandomId();
+
+        const url = new URL(process.env.NEXT_PUBLIC_GITBOOK_APP_URL ?? `https://app.gitbook.com`);
+        url.pathname = '/__session';
+        url.searchParams.set('proposed', proposed);
+
+        try {
+            const resp = await fetch(url, {
+                method: 'GET', // Use GET to play nicely with SameSite cookies.
+                credentials: 'include', // Make sure to send/receive cookies.
+                cache: 'no-cache',
+                mode: 'cors', // Need to use cors as we are on a different domain.
+            });
+
+            const { deviceId } = (await resp.json()) as { deviceId: string };
+            return deviceId;
+        } catch (error) {
+            console.error('Failed to fetch visitor session ID', error);
+            return proposed;
+        }
+    }
+}

packages/gitbook/src/components/PageBody/PageBody.tsx

@@ -14,15 +14,14 @@ import { hasFullWidthBlock, isNodeEmpty } from '@/lib/document';
 import { AncestorRevisionPage } from '@/lib/pages';
 import { ContentRefContext, resolveContentRef } from '@/lib/references';
 import { tcls } from '@/lib/tailwind';
-import { shouldTrackPageViews } from '@/lib/tracking';
 
 import { PageBodyBlankslate } from './PageBodyBlankslate';
 import { PageCover } from './PageCover';
 import { PageFooterNavigation } from './PageFooterNavigation';
 import { PageHeader } from './PageHeader';
 import { PreservePageLayout } from './PreservePageLayout';
-import { TrackPageView } from './TrackPageView';
 import { DocumentView, DocumentViewSkeleton } from '../DocumentView';
+import { TrackPageViewEvent } from '../Insights';
 import { PageFeedbackForm } from '../PageFeedback';
 import { DateRelative } from '../primitives';
 
@@ -39,7 +38,6 @@ export function PageBody(props: {
 }) {
     const {
         space,
-        pointer,
         contentTarget,
         customization,
         context,
@@ -146,14 +144,8 @@ export function PageBody(props: {
                     ) : null}
                 </div>
             </main>
-            {shouldTrackPageViews() ? (
+
-                <TrackPageView
+            <TrackPageViewEvent pageId={page.id} revisionId={space.revision} />
-                    sitePointer={pointer}
-                    spaceId={space.id}
-                    pageId={page.id}
-                    apiHost={api().client.endpoint}
-                />
-            ) : null}
         </>
     );
 }

packages/gitbook/src/components/PageBody/TrackPageView.tsx

@@ -1,112 +0,0 @@
-'use client';
-
-import type { RequestSiteTrackPageView, RequestSpaceTrackPageView } from '@gitbook/api';
-import cookies from 'js-cookie';
-import * as React from 'react';
-
-import { getVisitorId } from '@/lib/analytics';
-import { SiteContentPointer } from '@/lib/api';
-
-/**
- * Track the page view for the current page to integrations.
- */
-export function TrackPageView(props: {
-    apiHost: string;
-    sitePointer: SiteContentPointer;
-    spaceId: string;
-    pageId: string | undefined;
-}) {
-    const { apiHost, sitePointer, spaceId, pageId } = props;
-
-    React.useEffect(() => {
-        trackPageView({ apiHost, sitePointer, spaceId, pageId });
-    }, [apiHost, spaceId, pageId, sitePointer]);
-
-    return null;
-}
-
-async function sendSpaceTrackPageViewRequest(args: {
-    apiHost: string;
-    spaceId: string;
-    body: RequestSpaceTrackPageView;
-}) {
-    const { apiHost, spaceId, body } = args;
-    const url = new URL(apiHost);
-    url.pathname = `/v1/spaces/${spaceId}/insights/track_view`;
-
-    await fetch(url, {
-        method: 'POST',
-        headers: {
-            'Content-Type': 'application/json',
-        },
-        body: JSON.stringify(body),
-    });
-}
-
-async function sendSiteTrackPageViewRequest(args: {
-    apiHost: string;
-    sitePointer: SiteContentPointer;
-    body: RequestSiteTrackPageView;
-}) {
-    const { apiHost, sitePointer, body } = args;
-    const url = new URL(apiHost);
-    url.pathname = `/v1/orgs/${sitePointer.organizationId}/sites/${sitePointer.siteId}/insights/track_view`;
-
-    await fetch(url, {
-        method: 'POST',
-        headers: {
-            'Content-Type': 'application/json',
-        },
-        body: JSON.stringify(body),
-    });
-}
-
-let latestPageId: string | undefined | null = null;
-
-/**
- * Track the page view for the current page to GitBook.
- * We don't use the API client to avoid shipping 80kb of JS to the client.
- * And instead use a simple fetch.
- */
-async function trackPageView(args: {
-    apiHost: string;
-    sitePointer: SiteContentPointer;
-    spaceId: string;
-    pageId: string | undefined;
-}) {
-    const { apiHost, sitePointer, pageId, spaceId } = args;
-    if (pageId === latestPageId) {
-        // The hook can be called multiple times, we only want to track once.
-        return;
-    }
-
-    latestPageId = pageId;
-
-    const visitorId = await getVisitorId();
-    const sharedTrackedProps = {
-        url: window.location.href,
-        pageId,
-        visitor: {
-            anonymousId: visitorId,
-            userAgent: window.navigator.userAgent,
-            language: window.navigator.language,
-            cookies: cookies.get(),
-        },
-        referrer: document.referrer,
-    };
-
-    try {
-        sitePointer
-            ? await sendSiteTrackPageViewRequest({
-                  apiHost,
-                  sitePointer,
-                  body: {
-                      ...sharedTrackedProps,
-                      spaceId,
-                  },
-              })
-            : await sendSpaceTrackPageViewRequest({ apiHost, spaceId, body: sharedTrackedProps });
-    } catch (error) {
-        console.error('Failed to track page view', error);
-    }
-}

packages/gitbook/src/components/PageFeedback/PageFeedbackForm.tsx

@@ -5,9 +5,9 @@ import React from 'react';
 
 import { useLanguage } from '@/intl/client';
 import { t, tString } from '@/intl/translate';
-import { getVisitorId } from '@/lib/analytics';
 import { tcls } from '@/lib/tailwind';
 
+import { getVisitorId, useTrackEvent } from '../Insights';
 import { postPageFeedback } from './server-actions';
 
 /**
@@ -20,12 +20,20 @@ export function PageFeedbackForm(props: {
 }) {
     const { orientation = 'vertical', pageId, className } = props;
     const languages = useLanguage();
+    const trackEvent = useTrackEvent();
     const [submitted, setSubmitted] = React.useState(false);
 
     const onSubmit = async (rating: PageFeedbackRating) => {
         setSubmitted(true);
         const visitorId = await getVisitorId();
         await postPageFeedback({ pageId, visitorId, rating });
+
+        trackEvent({
+            type: 'page_post_feedback',
+            feedback: {
+                rating,
+            },
+        });
     };
 
     return (

packages/gitbook/src/components/RootLayout/CustomizationRootLayout.tsx

@@ -11,13 +11,12 @@ import assertNever from 'assert-never';
 import colorContrast from 'postcss-color-contrast/js';
 import colors from 'tailwindcss/colors';
 
-import { fonts, ibmPlexMono } from '@/fonts';
+import { fontNotoColorEmoji, fonts, ibmPlexMono } from '@/fonts';
 import { getSpaceLanguage } from '@/intl/server';
 import { getStaticFileURL } from '@/lib/assets';
 import { hexToRgb, shadesOfColor } from '@/lib/colors';
 import { tcls } from '@/lib/tailwind';
 
-import { emojiFontClassName } from '../primitives';
 import { ClientContexts } from './ClientContexts';
 
 import '@gitbook/icons/style.css';
@@ -154,7 +153,7 @@ export async function CustomizationRootLayout(props: {
             </head>
             <body
                 className={tcls(
-                    emojiFontClassName,
+                    fontNotoColorEmoji.className,
                     `${fonts[customization.styling.font].className}`,
                     `${ibmPlexMono.variable}`,
                     'bg-light',

packages/gitbook/src/components/RootLayout/globals.css

@@ -4,6 +4,8 @@
 
 @layer base {
     :root {
+        /* See packages/gitbook/src/fonts/index.ts */
+        --font-emoji: 'Apple Color Emoji', var(--font-noto-color-emoji);
         --scrollbar-width: calc(100vw - 100%);
 
         --dark-base: 20 20 20;
@@ -196,26 +198,5 @@ html.dark {
 /* Emojis */
 
 [class*='emoji'] {
-    font-family: var(--font-emojis-sbix);
+    font-family: var(--font-emoji);
-}
-
-/* Safari Only CSS here */
-_::-webkit-full-page-media,
-_:future,
-:root [class*='emoji'] {
-    font-family: var(--font-emojis-sbix);
-}
-
-/* Chrome Only CSS here */
-@media screen and (-webkit-min-device-pixel-ratio: 0) {
-    .emoji {
-        font-family: var(--font-emojis-colrv1);
-    }
-}
-
-/* Firefox Only CSS here */
-@-moz-document url-prefix() {
-    .emoji {
-        font-family: var(--font-emojis-colrv1);
-    }
 }

packages/gitbook/src/components/Search/SearchAskAnswer.tsx

@@ -14,6 +14,7 @@ import { tcls } from '@/lib/tailwind';
 
 import { AskAnswerResult, AskAnswerSource, streamAskQuestion } from './server-actions';
 import { useSearch, useSearchLink } from './useSearch';
+import { useTrackEvent } from '../Insights';
 import { Link } from '../primitives';
 
 type SearchState =
@@ -44,6 +45,7 @@ export function SearchAskAnswer(props: { pointer: SiteContentPointer; query: str
     const { pointer, query } = props;
 
     const language = useLanguage();
+    const trackEvent = useTrackEvent();
     const [, setSearchState] = useSearch();
     const [state, setState] = useRecoilState(searchAskState);
     const { organizationId, siteId, siteSpaceId } = pointer;
@@ -51,42 +53,34 @@ export function SearchAskAnswer(props: { pointer: SiteContentPointer; query: str
     React.useEffect(() => {
         let cancelled = false;
 
-        setState({
+        setState({ type: 'loading' });
-            type: 'loading',
-        });
 
         (async () => {
-            const stream = iterateStreamResponse(
+            trackEvent({
-                streamAskQuestion(organizationId, siteId, siteSpaceId ?? null, query),
+                type: 'ask_question',
-            );
+                query,
+            });
 
-            setSearchState((prev) =>
+            const response = streamAskQuestion(organizationId, siteId, siteSpaceId ?? null, query);
-                prev
+            const stream = iterateStreamResponse(response);
-                    ? {
+
-                          ...prev,
+            // When we pass in "ask" mode, the query could still be updated by the client
-                          ask: true,
+            // we ensure that the query is up-to-date before starting the stream.
-                          query,
+            setSearchState((prev) => (prev ? { ...prev, query, ask: true } : null));
-                      }
-                    : null,
-            );
 
             for await (const chunk of stream) {
                 if (cancelled) {
                     return;
                 }
-                setState({
+
-                    type: 'answer',
+                setState({ type: 'answer', answer: chunk });
-                    answer: chunk,
-                });
             }
-        })().catch((error) => {
+        })().catch(() => {
             if (cancelled) {
                 return;
             }
 
-            setState({
+            setState({ type: 'error' });
-                type: 'error',
-            });
         });
 
         return () => {
@@ -96,7 +90,7 @@ export function SearchAskAnswer(props: { pointer: SiteContentPointer; query: str
                 cancelled = true;
             }
         };
-    }, [organizationId, siteId, siteSpaceId, query]);
+    }, [organizationId, siteId, siteSpaceId, query, setState, setSearchState]);
 
     React.useEffect(() => {
         return () => {

packages/gitbook/src/components/Search/SearchButton.tsx

@@ -8,6 +8,7 @@ import { useLanguage, tString } from '@/intl/client';
 import { ClassValue, tcls } from '@/lib/tailwind';
 
 import { useSearch } from './useSearch';
+import { useTrackEvent } from '../Insights';
 
 /**
  * Button to open the search modal.
@@ -17,6 +18,7 @@ export function SearchButton(props: { children?: React.ReactNode; style?: ClassV
 
     const language = useLanguage();
     const [, setSearchState] = useSearch();
+    const trackEvent = useTrackEvent();
 
     const onClick = () => {
         setSearchState({
@@ -24,6 +26,10 @@ export function SearchButton(props: { children?: React.ReactNode; style?: ClassV
             global: false,
             query: '',
         });
+
+        trackEvent({
+            type: 'search_open',
+        });
     };
 
     return (
@@ -52,8 +58,8 @@ export function SearchButton(props: { children?: React.ReactNode; style?: ClassV
                 'shadow-dark/4',
                 'dark:shadow-none',
 
-                'text-dark/6',
+                'text-dark/7',
-                'dark:text-light/6',
+                'dark:text-light-4/7',
 
                 'rounded-lg',
                 'straight-corners:rounded-sm',
@@ -128,11 +134,11 @@ const Shortcut = () => {
                 'md:inline',
                 'justify-end',
                 'text-xs',
-                'text-dark/6',
+                'text-dark/7',
                 'contrast-more:text-dark',
-                'dark:text-light/6',
+                'dark:text-light-4/7',
-                'whitespace-nowrap',
                 'contrast-more:dark:text-light',
+                'whitespace-nowrap',
                 `[font-feature-settings:"calt",_"case"]`,
             )}
         >

packages/gitbook/src/components/Search/SearchModal.tsx

@@ -14,7 +14,7 @@ import { tcls } from '@/lib/tailwind';
 import { SearchAskAnswer, searchAskState } from './SearchAskAnswer';
 import { SearchResults, SearchResultsRef } from './SearchResults';
 import { SearchScopeToggle } from './SearchScopeToggle';
-import { SearchState, useSearch } from './useSearch';
+import { SearchState, UpdateSearchState, useSearch } from './useSearch';
 import { LoadingPane } from '../primitives/LoadingPane';
 
 interface SearchModalProps {
@@ -55,10 +55,6 @@ export function SearchModal(props: SearchModalProps) {
         };
     }, [isSearchOpened]);
 
-    const onChangeQuery = (newQuery: SearchState) => {
-        setSearchState(newQuery);
-    };
-
     const onClose = async (to?: string) => {
         await setSearchState(null);
         if (to) {
@@ -129,7 +125,7 @@ export function SearchModal(props: SearchModalProps) {
                         <SearchModalBody
                             {...props}
                             state={state}
-                            onChangeQuery={onChangeQuery}
+                            setSearchState={setSearchState}
                             onClose={onClose}
                         />
                     </div>
@@ -142,7 +138,7 @@ export function SearchModal(props: SearchModalProps) {
 function SearchModalBody(
     props: SearchModalProps & {
         state: SearchState;
-        onChangeQuery: (newQuery: SearchState) => void;
+        setSearchState: UpdateSearchState;
         onClose: (to?: string) => void;
     },
 ) {
@@ -154,7 +150,7 @@ function SearchModalBody(
         withAsk,
         isMultiVariants,
         state,
-        onChangeQuery,
+        setSearchState,
         onClose,
     } = props;
 
@@ -193,13 +189,17 @@ function SearchModalBody(
     };
 
     const onChange = (event: React.ChangeEvent<HTMLInputElement>) => {
-        onChangeQuery({
+        setSearchState({
             ask: false, // When typing, we go back to the default search mode
             query: event.target.value,
             global: state.global,
         });
     };
 
+    const onSwitchToAsk = () => {
+        setSearchState((state) => (state ? { ...state, ask: true } : null));
+    };
+
     return (
         <motion.div
             transition={{
@@ -311,13 +311,7 @@ function SearchModalBody(
                     global={isMultiVariants && state.global}
                     query={state.query}
                     withAsk={withAsk}
-                    onSwitchToAsk={() => {
+                    onSwitchToAsk={onSwitchToAsk}
-                        onChangeQuery({
-                            ask: true,
-                            query: state.query,
-                            global: state.global,
-                        });
-                    }}
                 ></SearchResults>
             ) : null}
             {state.query && state.ask && withAsk ? (

packages/gitbook/src/components/Search/SearchResults.tsx

@@ -14,6 +14,7 @@ import {
     searchSiteSpaceContent,
     searchAllSiteContent,
 } from './server-actions';
+import { useTrackEvent } from '../Insights';
 import { Loading } from '../primitives';
 
 export interface SearchResultsRef {
@@ -49,6 +50,7 @@ export const SearchResults = React.forwardRef(function SearchResults(
     const { children, query, pointer, spaceId, revisionId, global, withAsk, onSwitchToAsk } = props;
 
     const language = useLanguage();
+    const trackEvent = useTrackEvent();
     const debounceTimeout = React.useRef<Timer | null>(null);
     const [results, setResults] = React.useState<ResultType[] | null>(null);
     const [cursor, setCursor] = React.useState<number | null>(null);
@@ -96,6 +98,11 @@ export const SearchResults = React.forwardRef(function SearchResults(
                     : searchSiteSpaceContent(query, pointer, revisionId));
 
                 setResults(withAsk ? withQuestionResult(fetchedResults, query) : fetchedResults);
+
+                trackEvent({
+                    type: 'search_type_query',
+                    query,
+                });
             }, 350);
 
             return () => {

packages/gitbook/src/components/Search/useSearch.ts

@@ -16,18 +16,17 @@ const keyMap = {
     global: parseAsBoolean,
 };
 
-const options: UseQueryStatesOptions = {
+export type UpdateSearchState = (
-    history: 'replace',
+    update: React.SetStateAction<SearchState | null>,
-};
+) => Promise<URLSearchParams>;
 
 /**
  * Hook to access the current search query and update it.
  */
-export function useSearch(): [
+export function useSearch(): [SearchState | null, UpdateSearchState] {
-    SearchState | null,
+    const [rawState, setRawState] = useQueryStates(keyMap, {
-    (update: React.SetStateAction<SearchState | null>) => Promise<URLSearchParams>,
+        history: 'replace',
-] {
+    });
-    const [rawState, setRawState] = useQueryStates(keyMap, options);
 
     const state = React.useMemo<SearchState | null>(() => {
         if (rawState === null || rawState.q === null) {

packages/gitbook/src/components/SpaceLayout/SpaceLayout.tsx

@@ -16,11 +16,13 @@ import { CONTAINER_STYLE } from '@/components/layout';
 import { ColorDebugger } from '@/components/primitives/ColorDebugger';
 import { SearchModal } from '@/components/Search';
 import { TableOfContents } from '@/components/TableOfContents';
-import { ContentTarget, type SectionsList, SiteContentPointer } from '@/lib/api';
+import { api, ContentTarget, type SectionsList, SiteContentPointer } from '@/lib/api';
 import { ContentRefContext } from '@/lib/references';
 import { tcls } from '@/lib/tailwind';
+import { shouldTrackEvents } from '@/lib/tracking';
 
 import { SpacesDropdown } from '../Header/SpacesDropdown';
+import { InsightsProvider } from '../Insights';
 
 /**
  * Render the entire content of the space (header, table of contents, footer, and page content).
@@ -64,7 +66,11 @@ export function SpaceLayout(props: {
     const headerOffset = { sectionsHeader: withSections, topHeader: withTopHeader };
 
     return (
-        <>
+        <InsightsProvider
+            enabled={shouldTrackEvents()}
+            apiHost={api().client.endpoint}
+            {...content}
+        >
             {/* <ColorDebugger /> */}
             <Header
                 withTopHeader={withTopHeader}
@@ -137,6 +143,6 @@ export function SpaceLayout(props: {
                     pointer={content}
                 />
             </React.Suspense>
-        </>
+        </InsightsProvider>
     );
 }

packages/gitbook/src/components/primitives/Emoji/Emoji.tsx

@@ -1,51 +1,6 @@
-import localFont from 'next/font/local';
-
 import { getEmojiForCode } from '@/lib/emojis';
 import { ClassValue, tcls } from '@/lib/tailwind';
 
-/** 
-COLRv1 font.
-- lightweight, top quality
-- widely supported by modern browsers
-- currently not by Safari (or iOS)
-*/
-const colrv1Font = localFont({
-    src: './joypixels-colrv1.woff2',
-    preload: false,
-    variable: '--font-emojis-colrv1',
-});
-
-/** 
-SBIX font.
-- narrowly supported
-- currently required for Safari (or iOS)
-- provide alternative font-family name (see below)
-*/
-const sbixFont = localFont({
-    src: './joypixels-sbix.woff2',
-    preload: false,
-    variable: '--font-emojis-sbix',
-});
-
-/** 
-CBDT font.
-- widely supported
-- currently not by Safari (or iOS)
-- retain for legacy browser support
-*/
-const cbdtFont = localFont({
-    src: './joypixels-cbdt.woff2',
-    preload: false,
-    variable: '--font-emojis-cbdt',
-});
-
-/**
- * Class name to set on the <html> tag to use the emoji font.
- */
-export const emojiFontClassName = [colrv1Font.variable, sbixFont.variable, cbdtFont.variable].join(
-    ' ',
-);
-
 /**
  * Render an emoji by its codepoint.
  * It renders the UTF-8 character and use the emojione font to display it (fallbacking to default browser font).

packages/gitbook/src/fonts/index.ts

@@ -15,9 +15,17 @@ import {
     Roboto_Slab,
     Source_Sans_3,
     Ubuntu,
+    Noto_Color_Emoji,
 } from 'next/font/google';
 import localFont from 'next/font/local';
 
+export const fontNotoColorEmoji = Noto_Color_Emoji({
+    variable: '--font-noto-color-emoji',
+    weight: ['400'],
+    preload: false,
+    display: 'swap',
+});
+
 /*
     Fonts are downloaded and loaded by next/font.
 

packages/gitbook/src/lib/api.ts

@@ -214,6 +214,8 @@ export const getPublishedContentByUrl = cache({
     get: async (
         url: string,
         visitorAuthToken: string | undefined,
+        // Prefer undefined for a better cache key.
+        redirectOnError: true | undefined,
         options: CacheFunctionOptions,
     ) => {
         try {
@@ -221,6 +223,7 @@ export const getPublishedContentByUrl = cache({
                 {
                     url,
                     visitorAuthToken,
+                    redirectOnError,
                 },
                 {
                     signal: options.signal,

packages/gitbook/src/lib/tracking.ts

@@ -1,14 +1,15 @@
 import { headers } from 'next/headers';
 
 /**
- * Return true if a space track page views.
+ * Return true if events should be tracked on the site.
  */
-export function shouldTrackPageViews(): boolean {
+export function shouldTrackEvents(): boolean {
     const headerSet = headers();
 
     if (
-        process.env.GITBOOK_BLOCK_PAGE_VIEWS_TRACKING &&
+        process.env.NODE_ENV === 'development' ||
-        !headerSet.has('x-gitbook-track-page-views')
+        (process.env.GITBOOK_BLOCK_PAGE_VIEWS_TRACKING &&
+            !headerSet.has('x-gitbook-track-page-views'))
     ) {
         return false;
     }

packages/gitbook/src/lib/visitor-token.test.ts

@@ -2,23 +2,22 @@ import { it, describe, expect } from 'bun:test';
 import { NextRequest } from 'next/server';
 
 import {
-    VisitorAuthCookieValue,
     getVisitorAuthCookieName,
     getVisitorAuthCookieValue,
-    getVisitorAuthToken,
+    getVisitorToken,
-} from './visitor-auth';
+} from './visitor-token';
 
 describe('getVisitorAuthToken', () => {
     it('should return the token from the query parameters', () => {
         const request = nextRequest('https://example.com?jwt_token=123');
-        expect(getVisitorAuthToken(request, request.nextUrl)).toEqual('123');
+        expect(getVisitorToken(request, request.nextUrl)).toEqual({ source: 'url', token: '123' });
     });
 
     it('should return the token from the cookie root basepath', () => {
         const request = nextRequest('https://example.com', {
             [getVisitorAuthCookieName('/')]: { value: getVisitorAuthCookieValue('/', '123') },
         });
-        const visitorAuth = getVisitorAuthToken(request, request.nextUrl);
+        const visitorAuth = getVisitorToken(request, request.nextUrl);
         assertVisitorAuthCookieValue(visitorAuth);
         expect(visitorAuth.token).toEqual('123');
     });
@@ -27,7 +26,7 @@ describe('getVisitorAuthToken', () => {
         const request = nextRequest('https://example.com/hello/world', {
             [getVisitorAuthCookieName('/')]: { value: getVisitorAuthCookieValue('/', '123') },
         });
-        const visitorAuth = getVisitorAuthToken(request, request.nextUrl);
+        const visitorAuth = getVisitorToken(request, request.nextUrl);
         assertVisitorAuthCookieValue(visitorAuth);
         expect(visitorAuth.token).toEqual('123');
     });
@@ -39,7 +38,7 @@ describe('getVisitorAuthToken', () => {
                 value: getVisitorAuthCookieValue('/hello/', '123'),
             },
         });
-        const visitorAuth = getVisitorAuthToken(request, request.nextUrl);
+        const visitorAuth = getVisitorToken(request, request.nextUrl);
         assertVisitorAuthCookieValue(visitorAuth);
         expect(visitorAuth.token).toEqual('123');
     });
@@ -50,14 +49,14 @@ describe('getVisitorAuthToken', () => {
                 value: getVisitorAuthCookieValue('/hello/v/space1/', '123'),
             },
         });
-        const visitorAuth = getVisitorAuthToken(request, request.nextUrl);
+        const visitorAuth = getVisitorToken(request, request.nextUrl);
         assertVisitorAuthCookieValue(visitorAuth);
         expect(visitorAuth.token).toEqual('123');
     });
 
     it('should return undefined if no cookie and no query param', () => {
         const request = nextRequest('https://example.com');
-        expect(getVisitorAuthToken(request, request.nextUrl)).toBeUndefined();
+        expect(getVisitorToken(request, request.nextUrl)).toBeUndefined();
     });
 
     // For backwards compatibility
@@ -69,14 +68,21 @@ describe('getVisitorAuthToken', () => {
             },
         });
 
-        const visitorAuth = getVisitorAuthToken(request, request.nextUrl);
+        const visitorAuth = getVisitorToken(request, request.nextUrl);
         assertVisitorAuthCookieValue(visitorAuth);
         expect(visitorAuth.token).toEqual('gotcha');
     });
 });
 
-function assertVisitorAuthCookieValue(value: unknown): asserts value is VisitorAuthCookieValue {
+function assertVisitorAuthCookieValue(
-    if (value && typeof value === 'object' && 'token' in value) {
+    value: unknown,
+): asserts value is { source: 'visitor-auth-cookie'; basePath: string; token: string } {
+    if (
+        value &&
+        typeof value === 'object' &&
+        'source' in value &&
+        value.source === 'visitor-auth-cookie'
+    ) {
         return;
     }
 

packages/gitbook/src/lib/visitor-token.ts

@@ -2,25 +2,64 @@ import type { NextRequest } from 'next/server';
 import hash from 'object-hash';
 
 const VISITOR_AUTH_PARAM = 'jwt_token';
-const VISITOR_AUTH_COOKIE_ROOT = 'gitbook-visitor-token';
+const VISITOR_AUTH_COOKIE_ROOT = 'gitbook-visitor-token~';
+export const VISITOR_TOKEN_COOKIE = 'gitbook-visitor-token';
 
 /**
  * The contents of the visitor authentication cookie.
  */
-export type VisitorAuthCookieValue = {
+type VisitorAuthCookieValue = {
     basePath: string;
     token: string;
 };
 
 /**
- * Get the visitor authentication token for the request. This token can either be in the
+ * The result of a visitor token lookup.
+ */
+export type VisitorTokenLookup =
+    | {
+          /** A visitor token was found in the URL. */
+          source: 'url';
+          token: string;
+      }
+    | {
+          /** A visitor auth token was found in a VA cookie */
+          source: 'visitor-auth-cookie';
+          basePath: string;
+          token: string;
+      }
+    | {
+          /** A visitor token (not auth) was found in a cookie. */
+          source: 'gitbook-visitor-cookie';
+          token: string;
+      }
+    /** Not visitor token was found */
+    | undefined;
+
+/**
+ * Get the visitor token for the request. This token can either be in the
  * query parameters or stored as a cookie.
  */
-export function getVisitorAuthToken(
+export function getVisitorToken(
     request: NextRequest,
     url: URL | NextRequest['nextUrl'],
-): string | VisitorAuthCookieValue | undefined {
+): VisitorTokenLookup {
-    return url.searchParams.get(VISITOR_AUTH_PARAM) ?? getVisitorAuthTokenFromCookies(request, url);
+    const fromUrl = url.searchParams.get(VISITOR_AUTH_PARAM);
+
+    // Allow the empty string to come through
+    if (fromUrl !== null && fromUrl !== undefined) {
+        return { source: 'url', token: fromUrl };
+    }
+
+    const visitorAuthToken = getVisitorAuthTokenFromCookies(request, url);
+    if (visitorAuthToken) {
+        return { source: 'visitor-auth-cookie', ...visitorAuthToken };
+    }
+
+    const visitorCustomToken = getVisitorCustomTokenFromCookies(request);
+    if (visitorCustomToken) {
+        return { source: 'gitbook-visitor-cookie', token: visitorCustomToken };
+    }
 }
 
 /**
@@ -30,7 +69,7 @@ export function getVisitorAuthToken(
  * different content hosted on the same subdomain.
  */
 export function getVisitorAuthCookieName(basePath: string): string {
-    return `${VISITOR_AUTH_COOKIE_ROOT}~${hash(basePath)}`;
+    return `${VISITOR_AUTH_COOKIE_ROOT}${hash(basePath)}`;
 }
 
 /**
@@ -96,6 +135,20 @@ function getVisitorAuthTokenFromCookies(
     return undefined;
 }
 
+/**
+ * Return the value of a custom visitor cookie that can be set by third party backends
+ * when they authenticate their users off flow to relay information in the form of claims
+ * about the visitor.
+ *
+ * The cookie should contain as value a JWT encoded token that contains the claims of the visitor.
+ */
+function getVisitorCustomTokenFromCookies(request: NextRequest): string | undefined {
+    const visitorCustomCookie = Array.from(request.cookies).find(
+        ([, cookie]) => cookie.name === VISITOR_TOKEN_COOKIE,
+    );
+    return visitorCustomCookie ? visitorCustomCookie[1].value : undefined;
+}
+
 /**
  * Loop through all cookies and find the visitor authentication token for a given base path.
  */

packages/gitbook/src/middleware.ts

@@ -23,12 +23,12 @@ import { buildVersion } from '@/lib/build';
 import { createContentSecurityPolicyNonce, getContentSecurityPolicy } from '@/lib/csp';
 import { getURLLookupAlternatives, normalizeURL, setMiddlewareHeader } from '@/lib/middleware';
 import {
-    VisitorAuthCookieValue,
+    VisitorTokenLookup,
     getVisitorAuthCookieName,
     getVisitorAuthCookieValue,
-    getVisitorAuthToken,
+    getVisitorToken,
     normalizeVisitorAuthURL,
-} from '@/lib/visitor-auth';
+} from '@/lib/visitor-token';
 
 import { waitUntil } from './lib/waitUntil';
 
@@ -290,17 +290,17 @@ export async function middleware(request: NextRequest) {
     setMiddlewareHeader(response, 'referrer-policy', 'no-referrer-when-downgrade');
     setMiddlewareHeader(response, 'x-content-type-options', 'nosniff');
 
-    if (typeof resolved.cacheMaxAge === 'number') {
+    const cacheControl =
-        const cacheControl = `public, max-age=0, s-maxage=${resolved.cacheMaxAge}, stale-if-error=0`;
+        typeof resolved.cacheMaxAge === 'number'
+            ? `public, max-age=0, s-maxage=${resolved.cacheMaxAge}, stale-if-error=0`
+            : 'no-cache';
 
-        if (process.env.GITBOOK_OUTPUT_CACHE === 'true' && process.env.NODE_ENV !== 'development') {
+    if (process.env.GITBOOK_OUTPUT_CACHE === 'true' && process.env.NODE_ENV !== 'development') {
-            setMiddlewareHeader(response, 'cache-control', cacheControl);
+        setMiddlewareHeader(response, 'cache-control', cacheControl);
-            setMiddlewareHeader(response, 'Cloudflare-CDN-Cache-Control', cacheControl);
+        setMiddlewareHeader(response, 'Cloudflare-CDN-Cache-Control', cacheControl);
-        } else {
+    } else {
-            setMiddlewareHeader(response, 'x-gitbook-cache-control', cacheControl);
+        setMiddlewareHeader(response, 'x-gitbook-cache-control', cacheControl);
-        }
     }
-    // }
 
     if (resolved.cacheTags && resolved.cacheTags.length > 0) {
         const headerCacheTag = resolved.cacheTags.join(',');
@@ -433,7 +433,7 @@ async function lookupSiteInProxy(request: NextRequest, url: URL): Promise<Lookup
  * When serving multi spaces based on the current URL.
  */
 async function lookupSiteInMultiMode(request: NextRequest, url: URL): Promise<LookupResult> {
-    const visitorAuthToken = getVisitorAuthToken(request, url);
+    const visitorAuthToken = getVisitorToken(request, url);
     const lookup = await lookupSiteByAPI(url, visitorAuthToken);
     return {
         ...lookup,
@@ -636,7 +636,7 @@ async function lookupSiteInMultiPathMode(request: NextRequest, url: URL): Promis
     const target = new URL(targetStr);
     target.search = url.search;
 
-    const visitorAuthToken = getVisitorAuthToken(request, target);
+    const visitorAuthToken = getVisitorToken(request, target);
 
     const lookup = await lookupSiteByAPI(target, visitorAuthToken);
     if ('error' in lookup) {
@@ -676,7 +676,7 @@ async function lookupSiteInMultiPathMode(request: NextRequest, url: URL): Promis
  */
 async function lookupSiteByAPI(
     lookupURL: URL,
-    visitorAuthToken: ReturnType<typeof getVisitorAuthToken>,
+    visitorTokenLookup: VisitorTokenLookup,
 ): Promise<LookupResult> {
     const url = stripURLSearch(lookupURL);
     const lookup = getURLLookupAlternatives(url);
@@ -685,14 +685,16 @@ async function lookupSiteByAPI(
         `lookup content for url "${url.toString()}", with ${lookup.urls.length} alternatives`,
     );
 
+    // When the visitor auth token is pulled from the cookie, set redirectOnError when calling getPublishedContentByUrl to allow
+    // redirecting when the token is invalid as we could be dealing with stale token stored in the cookie.
+    // For example when the VA backend signature has changed but the token stored in the cookie is not yet expired.
+    const redirectOnError = visitorTokenLookup?.source === 'visitor-auth-cookie';
+
     const result = await race(lookup.urls, async (alternative, { signal }) => {
         const data = await getPublishedContentByUrl(
             alternative.url,
-            typeof visitorAuthToken === 'undefined'
+            visitorTokenLookup?.token,
-                ? undefined
+            redirectOnError || undefined,
-                : typeof visitorAuthToken === 'string'
-                  ? visitorAuthToken
-                  : visitorAuthToken.token,
             {
                 signal,
             },
@@ -789,7 +791,7 @@ async function lookupSiteByAPI(
  */
 function getLookupResultForVisitorAuth(
     basePath: string,
-    visitorAuthToken: string | VisitorAuthCookieValue,
+    visitorTokenLookup: VisitorTokenLookup,
 ): Partial<LookupResult> {
     return {
         // No caching for content served with visitor auth
@@ -797,19 +799,17 @@ function getLookupResultForVisitorAuth(
         cacheTags: [],
         cookies: {
             /**
-             * If the visitorAuthToken has been retrieved from a cookie, we set it back only
+             * If the visitor token has been retrieve from the URL, or if its a VA cookie and the basePath is the same, set it
-             * if the basePath matches the current one. This is to avoid setting cookie for
+             * as a cookie on the response.
-             * different base paths.
+             *
+             * Note that we do not re-store the gitbook-visitor-cookie in another cookie, to maintain a single source of truth.
              */
-            ...(typeof visitorAuthToken === 'string' || visitorAuthToken.basePath === basePath
+            ...(visitorTokenLookup?.source === 'url' ||
+            (visitorTokenLookup?.source === 'visitor-auth-cookie' &&
+                visitorTokenLookup.basePath === basePath)
                 ? {
                       [getVisitorAuthCookieName(basePath)]: {
-                          value: getVisitorAuthCookieValue(
+                          value: getVisitorAuthCookieValue(basePath, visitorTokenLookup.token),
-                              basePath,
-                              typeof visitorAuthToken === 'string'
-                                  ? visitorAuthToken
-                                  : visitorAuthToken.token,
-                          ),
                           options: {
                               httpOnly: true,
                               sameSite: process.env.NODE_ENV === 'production' ? 'none' : undefined,

packages/icons/bin/kit.js

@@ -11,7 +11,7 @@ export function getKitPath() {
     try {
         source = path.resolve(
             path.dirname(
-                url.fileURLToPath(import.meta.resolve('@awesome.me/kit-a463935e93/package.json')),
+                url.fileURLToPath(import.meta.resolve('@gitbook/fontawesome-pro/package.json')),
             ),
             'icons',
         );

packages/icons/package.json

@@ -22,7 +22,7 @@
         "@fortawesome/fontawesome-free": "^6.6.0"
     },
     "optionalDependencies": {
-        "@awesome.me/kit-a463935e93": "1.0.8"
+        "@gitbook/fontawesome-pro": "1.0.8"
     },
     "devDependencies": {
         "typescript": "^5.5.3"

packages/react-contentkit/package.json

@@ -10,7 +10,7 @@
     },
     "dependencies": {
         "classnames": "^2.5.1",
-        "@gitbook/api": "^0.77.0",
+        "@gitbook/api": "^0.84.0",
         "assert-never": "^1.2.1"
     },
     "peerDependencies": {

packages/react-openapi/package.json

@@ -10,7 +10,7 @@
     },
     "version": "0.7.1",
     "dependencies": {
-        "@scalar/api-client-react": "1.0.87",
+        "@scalar/api-client-react": "1.1.2",
         "classnames": "^2.5.1",
         "flatted": "^3.2.9",
         "openapi-types": "^12.1.3",

packages/react-openapi/src/OpenAPIOperation.tsx

@@ -29,7 +29,7 @@ export function OpenAPIOperation(props: {
 
     return (
         <ApiClientModalProvider
-            configuration={{ spec: { url: context.specUrl } }}
+            configuration={{ spec: { url: context.specUrl }, showSidebar: false }}
             initialRequest={{ path: data.path, method: data.method }}
         >
             <div className={classNames('openapi-operation', className)}>

packages/react-openapi/src/ScalarApiButton.tsx

@@ -13,7 +13,7 @@ export function ScalarApiButton({ method, path }: { method: string; path: string
         <div className="scalar scalar-activate">
             <button
                 className="scalar-activate-button"
-                onClick={() => client?.open({ method, path })}
+                onClick={() => client?.open({ method, path, _source: 'gitbook' })}
             >
                 <svg xmlns="http://www.w3.org/2000/svg" width="10" height="12" fill="none">
                     <path