@redocly/theme 0.69.0-next.1 → 0.69.0-next.11

package/lib/components/Toast/variables.js

@@ -18,7 +18,7 @@ exports.toast = (0, styled_components_1.css) `
   --toast-max-width: 360px;
   --toast-bg-color: var(--layer-color); // @presenter Color
   --toast-border: var(--border-width) var(--border-style) var(--border-color-secondary); // @presenter Border
-  --toast-border-radius: var(--border-radius-md); // @presenter BorderRadius
+  --toast-border-radius: var(--border-radius-lg); // @presenter BorderRadius
   --toast-font-family: var(--font-family-base); // @presenter FontFamily
 
   /**

package/lib/components/Tooltip/AnchorTooltip.js

@@ -209,7 +209,7 @@ const TooltipBody = styled_components_1.default.span.attrs(({ $anchorName }) =>
   overflow-wrap: break-word;
   text-align: left;
 
-  border-radius: var(--border-radius-md);
+  border-radius: var(--border-radius-lg);
   transition: opacity 0.3s ease-out;
 
   font-size: var(--font-size-base);
@@ -229,7 +229,7 @@ const TooltipBody = styled_components_1.default.span.attrs(({ $anchorName }) =>
 
   background: var(--tooltip-bg-color);
   color: var(--tooltip-text-color);
-  border: var(--tooltip-border-width, 0) var(--tooltip-border-style, solid)
+  border: var(--tooltip-border-width, 2px) var(--tooltip-border-style, solid)
     var(--tooltip-border-color, transparent);
   box-shadow: var(--bg-raised-shadow);
 

package/lib/components/Tooltip/JsTooltip.js

@@ -227,7 +227,7 @@ const TooltipBody = styled_components_1.default.span `
   word-break: normal;
   overflow-wrap: break-word;
 
-  border-radius: var(--border-radius-md);
+  border-radius: var(--border-radius-lg);
   transition: opacity 0.3s ease-out;
 
   font-size: var(--font-size-base);
@@ -247,7 +247,7 @@ const TooltipBody = styled_components_1.default.span `
 
   background: var(--tooltip-bg-color);
   color: var(--tooltip-text-color);
-  border: var(--tooltip-border-width, 0) var(--tooltip-border-style, solid)
+  border: var(--tooltip-border-width, 2px) var(--tooltip-border-style, solid)
     var(--tooltip-border-color, transparent);
   box-shadow: var(--bg-raised-shadow);
 

package/lib/components/UserMenu/variables.js

@@ -51,7 +51,7 @@ exports.userMenu = (0, styled_components_1.css) `
   --user-menu-dropdown-item-padding-vertical: var(--dropdown-menu-item-padding-vertical); // @presenter Spacing
   --user-menu-dropdown-item-separator-padding-top: var(--dropdown-menu-item-separator-padding-top ); // @presenter Spacing
   --user-menu-dropdown-item-separator-padding-bottom: var(--dropdown-menu-item-separator-padding-bottom ); // @presenter Spacing
-  --user-menu-dropdown-item-border-radius: var(--dropdown-menu-item-border-radius ); // @presenter BorderRadius
+  --user-menu-dropdown-item-border-radius: var(--dropdown-menu-item-border-radius); // @presenter BorderRadius
   --user-menu-dropdown-item-bg-color-active: var(--dropdown-menu-item-bg-color-active); // @presenter Color
   --user-menu-dropdown-item-bg-color-hover: var(--dropdown-menu-item-bg-color-hover); // @presenter Color
   --user-menu-dropdown-item-bg-color-disabled: var(--dropdown-menu-item-bg-color-disabled); // @presenter Color

package/lib/core/constants/mcp.d.ts

@@ -1 +1,5 @@
+import type { MCPOption } from '../types/mcp';
 export declare const DEFAULT_MCP_SERVER_NAME = "mcp-server";
+export declare const MCP_ROUTE = "/mcp";
+export declare const PUBLIC_MCP_ROUTE = "/mcp-public";
+export declare const DEFAULT_MCP_OPTIONS: MCPOption[];

package/lib/core/constants/mcp.js

@@ -1,5 +1,14 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.DEFAULT_MCP_SERVER_NAME = void 0;
+exports.DEFAULT_MCP_OPTIONS = exports.PUBLIC_MCP_ROUTE = exports.MCP_ROUTE = exports.DEFAULT_MCP_SERVER_NAME = void 0;
 exports.DEFAULT_MCP_SERVER_NAME = 'mcp-server';
+exports.MCP_ROUTE = '/mcp';
+exports.PUBLIC_MCP_ROUTE = '/mcp-public';
+exports.DEFAULT_MCP_OPTIONS = [
+    'cursor',
+    'vscode',
+    'claude-code',
+    'codex',
+    'copy',
+];
 //# sourceMappingURL=mcp.js.map

package/lib/core/constants/search.js

@@ -25,13 +25,13 @@ exports.AI_SEARCH_ERROR_CONFIG = {
         headerKey: 'search.ai.error.header.forbidden',
         headerDefault: 'Feature Unavailable',
         messageKey: 'search.ai.error.description.forbidden',
-        messageDefault: 'AI Search is currently unavailable.',
+        messageDefault: 'AI assistant is currently unavailable.',
     },
     [AiSearchError.Unauthorized]: {
         headerKey: 'search.ai.error.header.unauthorized',
         headerDefault: 'Authentication Required',
         messageKey: 'search.ai.error.description.unauthorized',
-        messageDefault: 'You are not authorized to use AI Search.',
+        messageDefault: 'You are not authorized to use AI assistant.',
     },
     [AiSearchError.HttpRequestFailed]: defaultErrorConfig,
     [AiSearchError.EmptyResponse]: defaultErrorConfig,

package/lib/core/contexts/AccordionGroupContext.d.ts

@@ -0,0 +1 @@
+export declare const AccordionGroupContext: import("react").Context<string | null>;

package/lib/core/contexts/AccordionGroupContext.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AccordionGroupContext = void 0;
+const react_1 = require("react");
+exports.AccordionGroupContext = (0, react_1.createContext)(null);
+//# sourceMappingURL=AccordionGroupContext.js.map

package/lib/core/contexts/PageActionsContext.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Whether the first heading inside the enclosing `Markdown` mounts the page actions.
+ * Without a provider `Heading` falls back to the page type in the page metadata.
+ */
+export declare const PageActionsContext: import("react").Context<boolean | null>;

package/lib/core/contexts/PageActionsContext.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PageActionsContext = void 0;
+const react_1 = require("react");
+/**
+ * Whether the first heading inside the enclosing `Markdown` mounts the page actions.
+ * Without a provider `Heading` falls back to the page type in the page metadata.
+ */
+exports.PageActionsContext = (0, react_1.createContext)(null);
+//# sourceMappingURL=PageActionsContext.js.map

package/lib/core/contexts/index.d.ts

@@ -1,7 +1,9 @@
 export * from './ThemeDataContext';
 export * from './MarkdownLinkContext';
+export * from './PageActionsContext';
 export * from './CodeWalkthrough/CodeWalkthroughControlsContext';
 export * from './CodeWalkthrough/CodeWalkthroughStepsContext';
+export * from './AccordionGroupContext';
 export * from './CodeSnippetContext';
 export * from './SearchContext';
 export * from './Toast/ToastContext';

package/lib/core/contexts/index.js

@@ -16,8 +16,10 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./ThemeDataContext"), exports);
 __exportStar(require("./MarkdownLinkContext"), exports);
+__exportStar(require("./PageActionsContext"), exports);
 __exportStar(require("./CodeWalkthrough/CodeWalkthroughControlsContext"), exports);
 __exportStar(require("./CodeWalkthrough/CodeWalkthroughStepsContext"), exports);
+__exportStar(require("./AccordionGroupContext"), exports);
 __exportStar(require("./CodeSnippetContext"), exports);
 __exportStar(require("./SearchContext"), exports);
 __exportStar(require("./Toast/ToastContext"), exports);

package/lib/core/hooks/code-walkthrough/use-code-walkthrough-controls.js

@@ -16,9 +16,6 @@ function useCodeWalkthroughControls(filters, inputs, toggles, enableDeepLink) {
     const location = (0, react_router_1.useLocation)();
     const navigate = (0, react_router_1.useNavigate)();
     const searchParams = (0, react_1.useMemo)(() => new URLSearchParams(location.search), [location.search]);
-    const filtersRef = (0, react_1.useRef)(filters);
-    const inputsRef = (0, react_1.useRef)(inputs);
-    const togglesRef = (0, react_1.useRef)(toggles);
     const getInitialState = () => {
         var _a, _b;
         var _c, _d;
@@ -36,18 +33,10 @@ function useCodeWalkthroughControls(filters, inputs, toggles, enableDeepLink) {
         return state;
     };
     const [controlsState, setControlsState] = (0, react_1.useState)(getInitialState);
-    (0, react_1.useEffect)(() => {
-        const sameProps = [
-            JSON.stringify(filters) === JSON.stringify(filtersRef.current),
-            JSON.stringify(inputs) === JSON.stringify(inputsRef.current),
-            JSON.stringify(toggles) === JSON.stringify(togglesRef.current),
-        ];
-        if (sameProps.every(Boolean)) {
-            return;
-        }
-        filtersRef.current = filters;
-        inputsRef.current = inputs;
-        togglesRef.current = toggles;
+    const controlsKey = JSON.stringify([filters, inputs, toggles]);
+    const [prevControlsKey, setPrevControlsKey] = (0, react_1.useState)(controlsKey);
+    if (prevControlsKey !== controlsKey) {
+        setPrevControlsKey(controlsKey);
         const newState = getInitialState();
         // Preserve existing values where control type hasn't changed
         Object.entries(newState).forEach(([id, control]) => {
@@ -58,8 +47,7 @@ function useCodeWalkthroughControls(filters, inputs, toggles, enableDeepLink) {
             }
         });
         setControlsState(newState);
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [filters, inputs, toggles, enableDeepLink]);
+    }
     const changeControlState = (id, value) => {
         setControlsState((prev) => {
             const control = prev[id];

package/lib/core/hooks/code-walkthrough/use-code-walkthrough-steps.js

@@ -58,6 +58,7 @@ function useCodeWalkthroughSteps({ steps, enableDeepLink, root, }) {
                 startOffset: markersMinTopOffset < endOffset ? startOffset : 0,
             });
         }
+        // oxlint-disable-next-line react-you-might-not-need-an-effect/no-chain-state-updates -- marker geometry is derived from post-layout measurements (offsetTop, clientHeight, window.innerHeight)
         setMarkers(markers.reduce((acc, marker, index) => {
             var _a;
             const step = visibleSteps[index];
@@ -171,6 +172,7 @@ function useCodeWalkthroughSteps({ steps, enableDeepLink, root, }) {
         }
         const rootTopOffset = (_c = (_a = root.current) === null || _a === void 0 ? void 0 : _a.offsetTop) !== null && _c !== void 0 ? _c : 0;
         if (!activeStep && rootTopOffset <= options.navbarHeight) {
+            // oxlint-disable-next-line react-you-might-not-need-an-effect/no-derived-state -- seeded from root.current.offsetTop, a post-layout measurement
             setActiveStep(((_b = visibleSteps[0]) === null || _b === void 0 ? void 0 : _b.id) || null);
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps

package/lib/core/hooks/menu/use-menu-item-expanded.js

@@ -11,6 +11,7 @@ function useMenuItemExpanded(item) {
     // it's important for transitions
     const [controlledValue, setControlledValue] = (0, react_1.useState)(isItemExpanded(item));
     (0, react_1.useEffect)(() => {
+        // oxlint-disable-next-line react-you-might-not-need-an-effect/no-derived-state -- deferred a commit on purpose so CSS transitions still run
         setIsExpanded(controlledValue);
     }, [controlledValue]);
     (0, react_1.useEffect)(() => {

package/lib/core/hooks/use-active-heading.js

@@ -5,16 +5,20 @@ const react_1 = require("react");
 const react_router_1 = require("react-router");
 const utils_1 = require("../utils");
 const constants_1 = require("../constants");
+const TARGET_TOLERANCE = 2;
 function useActiveHeading(contentElement, displayedHeadings) {
     const [heading, setHeading] = (0, react_1.useState)(undefined);
     const [headingElements, setHeadingElements] = (0, react_1.useState)([]);
     const headingElementsRef = (0, react_1.useRef)({});
     const displayedHeadingsRef = (0, react_1.useRef)(displayedHeadings);
     const lockObserver = (0, react_1.useRef)(false);
+    const clickScroll = (0, react_1.useRef)(null);
     const location = (0, react_router_1.useLocation)();
     (0, react_1.useEffect)(() => {
         setHeading(undefined);
         headingElementsRef.current = {};
+        clickScroll.current = null;
+        lockObserver.current = false;
     }, [location.pathname]);
     (0, react_1.useEffect)(() => {
         displayedHeadingsRef.current = displayedHeadings;
@@ -98,13 +102,13 @@ function useActiveHeading(contentElement, displayedHeadings) {
     }, [calculateVirtualPositions]);
     const intersectionCallback = (0, react_1.useCallback)((entries) => {
         var _a, _b, _c;
-        if (lockObserver.current) {
-            return;
-        }
         headingElementsRef.current = entries.reduce((map, entry) => {
             map[entry.target.id] = entry;
             return map;
         }, headingElementsRef.current);
+        if (lockObserver.current) {
+            return;
+        }
         if (isTopOfPage()) {
             const newHeading = ((_a = headingElements[0]) === null || _a === void 0 ? void 0 : _a.id) || undefined;
             setHeading(newHeading);
@@ -145,37 +149,79 @@ function useActiveHeading(contentElement, displayedHeadings) {
         }
         setHeading(visibleHeadings[0].target.id);
     }, [getIndexFromId, headingElements, getTriggerOffset, findActiveHeaderByVirtualPosition]);
+    const releaseClickScroll = (0, react_1.useCallback)(() => {
+        clickScroll.current = null;
+        lockObserver.current = false;
+    }, []);
+    const trackClickScroll = (0, react_1.useCallback)(() => {
+        const clickScrollState = clickScroll.current;
+        if (!clickScrollState) {
+            return;
+        }
+        const { top } = clickScrollState.target.getBoundingClientRect();
+        if (clickScrollState.reached) {
+            if (top >= 0 && top <= getTriggerOffset()) {
+                return;
+            }
+        }
+        else {
+            const distance = Math.abs(top - clickScrollState.scrollMargin);
+            if (distance <= TARGET_TOLERANCE) {
+                clickScrollState.reached = true;
+                return;
+            }
+            if (distance <= clickScrollState.closestDistance + TARGET_TOLERANCE) {
+                clickScrollState.closestDistance = Math.min(clickScrollState.closestDistance, distance);
+                return;
+            }
+        }
+        releaseClickScroll();
+        intersectionCallback([]);
+    }, [releaseClickScroll, intersectionCallback, getTriggerOffset]);
     const handleHeadingClick = (0, react_1.useCallback)((headingId) => {
-        lockObserver.current = true;
+        releaseClickScroll();
         setHeading(headingId);
-        const headingElement = headingElements.find((el) => el.id === headingId);
-        if (headingElement && headingElement.scrollIntoView) {
-            headingElement.scrollIntoView({ behavior: 'smooth', block: 'start' });
-        }
-        setTimeout(() => {
-            headingElementsRef.current = {};
-            lockObserver.current = false;
-        }, 300);
-    }, [headingElements]);
+        const target = document.getElementById(headingId) || headingElements.find((el) => el.id === headingId);
+        if (!(target === null || target === void 0 ? void 0 : target.scrollIntoView)) {
+            return;
+        }
+        target.scrollIntoView({ behavior: 'smooth', block: 'start' });
+        if (!target.getClientRects().length) {
+            return;
+        }
+        const scrollMargin = parseFloat(getComputedStyle(target).scrollMarginTop) || 0;
+        const distance = Math.abs(target.getBoundingClientRect().top - scrollMargin);
+        lockObserver.current = true;
+        clickScroll.current = {
+            target,
+            scrollMargin,
+            closestDistance: distance,
+            reached: distance <= TARGET_TOLERANCE,
+        };
+    }, [headingElements, releaseClickScroll]);
     (0, react_1.useEffect)(() => {
         var _a;
         if (!contentElement) {
             return;
         }
         const headers = findHeaders(contentElement);
+        // oxlint-disable-next-line react-you-might-not-need-an-effect/no-chain-state-updates -- headings and the initial active heading come from DOM queries and scroll measurement, available only after layout
         setHeadingElements(headers);
         if (headers.length > 0 && !heading) {
             if (isTopOfPage()) {
+                // oxlint-disable-next-line react-you-might-not-need-an-effect/no-chain-state-updates -- see above
                 setHeading(headers[0].id);
             }
             else {
                 const totalHeight = scrollY + window.innerHeight;
                 if (totalHeight >= document.body.scrollHeight - 10) {
+                    // oxlint-disable-next-line react-you-might-not-need-an-effect/no-chain-state-updates -- see above
                     setHeading(((_a = headers[headers.length - 1]) === null || _a === void 0 ? void 0 : _a.id) || undefined);
                 }
                 else {
                     const triggerOffset = getTriggerOffset();
                     const activeHeader = findActiveHeaderByVirtualPosition(headers, scrollY, triggerOffset);
+                    // oxlint-disable-next-line react-you-might-not-need-an-effect/no-chain-state-updates -- see above
                     setHeading(activeHeader.id);
                 }
             }
@@ -203,8 +249,10 @@ function useActiveHeading(contentElement, displayedHeadings) {
         });
         const handleScroll = () => {
             var _a;
-            if (lockObserver.current)
+            if (clickScroll.current) {
+                trackClickScroll();
                 return;
+            }
             if (isTopOfPage()) {
                 setHeading(((_a = headingElements[0]) === null || _a === void 0 ? void 0 : _a.id) || undefined);
             }
@@ -214,7 +262,7 @@ function useActiveHeading(contentElement, displayedHeadings) {
             observer.disconnect();
             window.removeEventListener('scroll', handleScroll);
         };
-    }, [headingElements, intersectionCallback, getTriggerOffset]);
+    }, [headingElements, intersectionCallback, getTriggerOffset, trackClickScroll]);
     return { heading, handleHeadingClick };
 }
 //# sourceMappingURL=use-active-heading.js.map

package/lib/core/hooks/use-active-section-id.js

@@ -45,10 +45,12 @@ function useActiveSectionId(location, hasOverviewPage = false, withNavbar = true
             return;
         }
         window.addEventListener('scroll', scrollListener, { capture: false });
-        setTimeout(() => {
+        const initialRead = setTimeout(() => {
             scrollListener();
         }, 10);
         return () => {
+            clearTimeout(initialRead);
+            scrollListener.cancel();
             window.removeEventListener('scroll', scrollListener);
         };
     }, [location, heightOffset, scrollListener]);

package/lib/core/hooks/use-connect-mcp-button.d.ts

@@ -3,7 +3,7 @@ export type McpButtonOptions = {
     options?: MCPOption[];
 };
 export type McpButtonSettings = {
-    isCopied: boolean;
+    copiedOption: MCPOption | null;
     cursorUrl: string;
     vscodeUrl: string;
     triggerButtonText: string;

package/lib/core/hooks/use-connect-mcp-button.js

@@ -9,24 +9,32 @@ const lodash_debounce_1 = __importDefault(require("lodash.debounce"));
 const use_theme_hooks_1 = require("./use-theme-hooks");
 const use_mcp_config_1 = require("./use-mcp-config");
 const clipboard_service_1 = require("../utils/clipboard-service");
+const mcp_1 = require("../constants/mcp");
+const mcp_2 = require("../utils/mcp");
+const get_base_data_attributes_1 = require("../utils/telemetry/get-base-data-attributes");
 const COPIED_RESET_TIMEOUT = 1000;
-function useConnectMCPButton({ options = ['cursor', 'vscode', 'copy'], } = {}) {
-    const { useTranslate } = (0, use_theme_hooks_1.useThemeHooks)();
+function useConnectMCPButton({ options = mcp_1.DEFAULT_MCP_OPTIONS, } = {}) {
+    const { useTranslate, useTelemetry } = (0, use_theme_hooks_1.useThemeHooks)();
     const { translate } = useTranslate();
+    const telemetry = useTelemetry();
     const { serverName, serverUrl, cursorUrl, vscodeUrl } = (0, use_mcp_config_1.useMCPConfig)();
-    const [isCopied, setIsCopied] = (0, react_1.useState)(false);
+    const [copiedOption, setCopiedOption] = (0, react_1.useState)(null);
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    const resetCopied = (0, react_1.useCallback)((0, lodash_debounce_1.default)(() => setIsCopied(false), COPIED_RESET_TIMEOUT), []);
+    const resetCopied = (0, react_1.useCallback)((0, lodash_debounce_1.default)(() => setCopiedOption(null), COPIED_RESET_TIMEOUT), []);
     const handleAction = (0, react_1.useCallback)((action) => {
-        if (action === 'copy') {
-            const config = {
-                [serverName]: {
-                    url: serverUrl,
-                    description: 'MCP Server',
-                },
-            };
-            clipboard_service_1.ClipboardService.copyCustom(JSON.stringify(config, null, 2));
-            setIsCopied(true);
+        telemetry.sendConnectMcpClickedMessage([
+            Object.assign(Object.assign({}, (0, get_base_data_attributes_1.getBaseDataAttributes)('connectMcp', 'button')), { option: action }),
+        ]);
+        const connection = { serverName, url: serverUrl };
+        const copyTextMap = {
+            copy: JSON.stringify({ [serverName]: { url: serverUrl, description: 'MCP Server' } }, null, 2),
+            'claude-code': (0, mcp_2.generateClaudeCodeCommand)(connection),
+            codex: (0, mcp_2.generateCodexCommand)(connection),
+        };
+        const copyText = copyTextMap[action];
+        if (copyText !== undefined) {
+            clipboard_service_1.ClipboardService.copyCustom(copyText);
+            setCopiedOption(action);
             resetCopied();
             return;
         }
@@ -35,11 +43,11 @@ function useConnectMCPButton({ options = ['cursor', 'vscode', 'copy'], } = {}) {
             vscode: vscodeUrl,
         };
         window.open(urlMap[action], '_blank');
-    }, [cursorUrl, vscodeUrl, serverUrl, serverName, resetCopied]);
+    }, [cursorUrl, vscodeUrl, serverUrl, serverName, resetCopied, telemetry]);
     const triggerButtonText = (0, react_1.useMemo)(() => translate('page.actions.connectMcp', 'Connect MCP'), [translate]);
     const visibleOptions = (0, react_1.useMemo)(() => options.filter(Boolean), [options]);
     return {
-        isCopied,
+        copiedOption,
         cursorUrl,
         vscodeUrl,
         triggerButtonText,

package/lib/core/hooks/use-control.js

@@ -11,6 +11,9 @@ const useControl = (initialVal = false) => {
             clearTimeout(timeoutRef.current);
         }
     }, []);
+    (0, react_1.useEffect)(() => {
+        return clearOpenTimer;
+    }, [clearOpenTimer]);
     const handleOpen = (0, react_1.useCallback)(() => {
         clearOpenTimer();
         timeoutRef.current = setTimeout(() => {

package/lib/core/hooks/use-local-state.js

@@ -22,6 +22,7 @@ function useLocalState(key, initialValue) {
     (0, react_1.useEffect)(() => {
         if (!(0, js_utils_1.isBrowser)())
             return;
+        // oxlint-disable-next-line react-you-might-not-need-an-effect/no-derived-state -- localStorage is read after mount so SSR and client hydrate from the same value
         setValue(getStoredValue(key, initialValue));
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [key]);

package/lib/core/hooks/use-mcp-config.d.ts

@@ -5,5 +5,7 @@ export type McpConfig = {
     cursorUrl: string;
     vscodeUrl: string;
     isMcpDisabled: boolean;
+    isPublicEndpointPage: boolean;
+    alternateServerUrl?: string;
 };
 export declare function useMCPConfig(): McpConfig;

package/lib/core/hooks/use-mcp-config.js

@@ -9,13 +9,21 @@ const mcp_1 = require("../utils/mcp");
 const urls_1 = require("../utils/urls");
 function useMCPConfig() {
     var _a;
-    const { useMcpData } = (0, use_theme_hooks_1.useThemeHooks)();
-    const { docs: { enabled, name }, } = useMcpData();
+    var _b;
+    const { useMcpData, usePageData } = (0, use_theme_hooks_1.useThemeHooks)();
+    const { docs: { enabled, name, publicEndpoint }, } = useMcpData();
+    const pageSlug = (_a = usePageData()) === null || _a === void 0 ? void 0 : _a.slug;
     const origin = dom_1.IS_BROWSER
         ? window.location.origin
-        : ((_a = globalThis['SSR_HOSTNAME']) !== null && _a !== void 0 ? _a : '');
+        : ((_b = globalThis['SSR_HOSTNAME']) !== null && _b !== void 0 ? _b : '');
     const serverName = name || constants_1.DEFAULT_MCP_SERVER_NAME;
-    const serverUrl = `${origin}${(0, urls_1.withPathPrefix)('/mcp')}`;
+    const isPublicEndpointPage = pageSlug === (0, urls_1.withPathPrefix)(constants_1.PUBLIC_MCP_ROUTE);
+    const serverUrl = `${origin}${(0, urls_1.withPathPrefix)(isPublicEndpointPage ? constants_1.PUBLIC_MCP_ROUTE : constants_1.MCP_ROUTE)}`;
+    const alternateServerUrl = isPublicEndpointPage
+        ? `${origin}${(0, urls_1.withPathPrefix)(constants_1.MCP_ROUTE)}`
+        : publicEndpoint
+            ? `${origin}${(0, urls_1.withPathPrefix)(constants_1.PUBLIC_MCP_ROUTE)}`
+            : undefined;
     const isMcpDisabled = !enabled || false;
     const cursorUrl = (0, react_1.useMemo)(() => (0, mcp_1.generateMCPDeepLink)('cursor', { serverName, url: serverUrl }), [serverName, serverUrl]);
     const vscodeUrl = (0, react_1.useMemo)(() => (0, mcp_1.generateMCPDeepLink)('vscode', { serverName, url: serverUrl }), [serverName, serverUrl]);
@@ -26,6 +34,8 @@ function useMCPConfig() {
         cursorUrl,
         vscodeUrl,
         isMcpDisabled,
+        isPublicEndpointPage,
+        alternateServerUrl,
     };
 }
 //# sourceMappingURL=use-mcp-config.js.map

package/lib/core/hooks/use-mobile-menu.js

@@ -7,9 +7,17 @@ const use_modal_scroll_lock_1 = require("./use-modal-scroll-lock");
 function useMobileMenu(initialState = false) {
     const location = (0, react_router_1.useLocation)();
     const [isOpen, setIsOpen] = (0, react_1.useState)(initialState);
-    (0, react_1.useEffect)(() => setIsOpen(false), [location.pathname, location.hash]);
+    const locationKey = `${location.pathname}${location.hash}`;
+    const [prevLocationKey, setPrevLocationKey] = (0, react_1.useState)(locationKey);
+    if (isOpen && prevLocationKey !== locationKey) {
+        setPrevLocationKey(locationKey);
+        setIsOpen(false);
+    }
     (0, use_modal_scroll_lock_1.useModalScrollLock)(isOpen);
-    const openMobileMenu = () => setIsOpen(true);
+    const openMobileMenu = () => {
+        setPrevLocationKey(locationKey);
+        setIsOpen(true);
+    };
     const closeMobileMenu = () => setIsOpen(false);
     return { isOpen, openMobileMenu, closeMobileMenu };
 }

package/lib/core/hooks/use-tabs.js

@@ -220,12 +220,14 @@ const useActiveTab = ({ initialTab, tabsId }) => {
     const [activeTab, setActiveTab] = (0, react_1.useState)(undefined);
     const resolvedActiveTab = activeTab !== null && activeTab !== void 0 ? activeTab : initialTab;
     const prevActiveTabRef = (0, react_1.useRef)(resolvedActiveTab);
+    const isTabResolvedFromHashRef = (0, react_1.useRef)(false);
     (0, react_1.useEffect)(() => {
-        if (activeTab !== undefined) {
+        if (isTabResolvedFromHashRef.current) {
             return;
         }
+        isTabResolvedFromHashRef.current = true;
         setActiveTab(getInitialTab({ initialTab, hash: location.hash, tabsId }));
-    }, [activeTab, initialTab, location.hash, tabsId]);
+    }, [initialTab, location.hash, tabsId]);
     (0, react_1.useEffect)(() => {
         const hasActiveTabChanged = prevActiveTabRef.current !== resolvedActiveTab;
         if (!tabsId || !hasActiveTabChanged) {

package/lib/core/hooks/use-telemetry-fallback.d.ts

@@ -34,6 +34,8 @@ export declare const useTelemetryFallback: () => {
     sendProductPickerChangedMessage: () => void;
     sendLogoClickedMessage: () => void;
     sendCodeSnippetReportedMessage: () => void;
+    sendConnectMcpClickedMessage: () => void;
+    sendMcpConnectionSnippetCopiedMessage: () => void;
     sendMobileMenuClosedMessage: () => void;
     sendMobileMenuOpenedMessage: () => void;
     sendPageViewedMessage: () => void;

package/lib/core/hooks/use-telemetry-fallback.js

@@ -39,6 +39,8 @@ const useTelemetryFallback = () => ({
     sendProductPickerChangedMessage: () => { },
     sendLogoClickedMessage: () => { },
     sendCodeSnippetReportedMessage: () => { },
+    sendConnectMcpClickedMessage: () => { },
+    sendMcpConnectionSnippetCopiedMessage: () => { },
     sendMobileMenuClosedMessage: () => { },
     sendMobileMenuOpenedMessage: () => { },
     sendPageViewedMessage: () => { },