@redocly/theme 0.65.0-next.1 → 0.65.0-next.3

package/lib/components/Banner/Banner.js

@@ -128,7 +128,7 @@ function Banner({ className }) {
         return null;
     }
     return (react_1.default.createElement(BannerWrapper, { ref: bannerRef, "data-component-name": "Banner/Banner", className: className, "$color": displayBanner.color, "$isVisible": isVisible },
-        react_1.default.createElement(BannerContent, null,
+        react_1.default.createElement(BannerContent, { "$color": displayBanner.color },
             react_1.default.createElement(contexts_1.MarkdownLinkContext.Provider, { value: markdownLinkContextValue },
                 react_1.default.createElement(Markdown_1.Markdown, { compact: true }, markdownContent))),
         displayBanner.dismissible && (react_1.default.createElement(DismissButton, { variant: "ghost", size: "var(--banner-button-size)", icon: react_1.default.createElement(CloseIcon_1.CloseIcon, { color: `var(--banner-${displayBanner.color}-icon-color)`, size: "16px" }), onClick: () => {
@@ -149,7 +149,15 @@ const BannerContent = styled_components_1.default.div `
 
     a:not([role='button']) {
       color: var(--banner-link-color);
-      text-decoration: var(--banner-link-decoration);
+      text-decoration: ${({ $color }) => $color && `var(--banner-${$color}-link-decoration)`};
+
+      &:hover, &:focus {
+        text-decoration: ${({ $color }) => $color && `var(--banner-${$color}-link-decoration-hover)`};
+      }
+
+      &:visited {
+        text-decoration: ${({ $color }) => $color && `var(--banner-${$color}-link-decoration)`};
+      }
     }
 
     [data-component-name='Button/Button'] {

package/lib/components/Banner/variables.js

@@ -19,7 +19,6 @@ exports.banner = (0, styled_components_1.css) `
   --banner-button-icon-right-padding: 1px 10px 1px var(--spacing-sm); // @presenter Spacing
   --banner-button-margin: 0 var(--spacing-xs); // @presenter Spacing
   --banner-padding: var(--spacing-xs); // @presenter Spacing
-  --banner-link-decoration: var(--link-decoration-hover);
   --banner-min-height: 38px;
   --banner-gap: var(--spacing-xxs); // @presenter Spacing
 
@@ -27,20 +26,28 @@ exports.banner = (0, styled_components_1.css) `
   --banner-info-text-color: var(--color-static-white); // @presenter Color
   --banner-info-icon-color: var(--color-static-white); // @presenter Color
   --banner-info-link-color: var(--banner-info-text-color); // @presenter Color
+  --banner-info-link-decoration: underline 1px var(--banner-info-link-color);
+  --banner-info-link-decoration-hover: underline 2px var(--banner-info-link-color);
 
   --banner-success-bg-color: var(--color-success-base); // @presenter Color
   --banner-success-text-color: var(--color-static-white); // @presenter Color
   --banner-success-icon-color: var(--color-static-white); // @presenter Color
   --banner-success-link-color: var(--banner-success-text-color); // @presenter Color
+  --banner-success-link-decoration: underline 1px var(--banner-success-link-color);
+  --banner-success-link-decoration-hover: underline 2px var(--banner-success-link-color);
 
   --banner-warning-bg-color: var(--color-warning-base); // @presenter Color
   --banner-warning-text-color: var(--color-black); // @presenter Color
   --banner-warning-icon-color: var(--color-black); // @presenter Color
   --banner-warning-link-color: var(--banner-warning-text-color); // @presenter Color
+  --banner-warning-link-decoration: underline 1px var(--banner-warning-link-color);
+  --banner-warning-link-decoration-hover: underline 2px var(--banner-warning-link-color);
 
   --banner-error-bg-color: var(--color-error-base); // @presenter Color
   --banner-error-text-color: var(--color-static-white); // @presenter Color
   --banner-error-icon-color: var(--color-static-white); // @presenter Color
   --banner-error-link-color: var(--banner-error-text-color); // @presenter Color
+  --banner-error-link-decoration: underline 1px var(--banner-error-link-color);
+  --banner-error-link-decoration-hover: underline 2px var(--banner-error-link-color);
 `;
 //# sourceMappingURL=variables.js.map

package/lib/components/Button/variables.js

@@ -49,9 +49,9 @@ exports.button = (0, styled_components_1.css) `
   --button-content-color-custom-hover: var(--color-warm-grey-11); // @presenter Color
   --button-bg-color-custom: var(--color-white); // @presenter Color
 
-  --button-content-color-link: var(--link-color-primary);
-  --button-content-color-link-hover: var(--link-color-primary-hover);
-  --button-content-color-link-pressed: var(--link-color-primary-pressed);
+  --button-content-color-link: var(--color-primary-base, var(--button-content-color-link-legacy));
+  --button-content-color-link-hover: var(--color-primary-active, var(--button-content-color-link-hover-legacy));
+  --button-content-color-link-pressed: var(--color-primary-base, var(--button-content-color-link-pressed-legacy));
 
   /**
    * @tokens Button default values

package/lib/components/CodeBlock/CodeBlockContainer.js

@@ -64,18 +64,21 @@ const CodeBlockContainerComponent = styled_components_1.default.pre `
   }
 
   .highlighted {
-    background: var(--layer-color-hover);
+    background: var(--code-block-highlighted-bg-color);
     margin-left: calc(var(--spacing-sm) * -1);
     padding-left: var(--spacing-sm);
     width: calc(100% + var(--spacing-sm));
     display: inline-block;
+    border-left: var(--code-block-highlighted-border-left);
 
     &.error {
-      background: var(--color-raspberry-2);
+      background: var(--color-error-bg);
+      border-left: 1px solid var(--color-error-base);
     }
 
     &.warning {
-      background: var(--color-carrot-2);
+      background: var(--color-warning-bg);
+      border-left: 1px solid var(--color-warning-base);
     }
   }
 
@@ -114,18 +117,20 @@ const CodeBlockContainerComponent = styled_components_1.default.pre `
     display: inline-block;
 
     &.add {
-      background: var(--color-grass-2);
+      background: var(--color-success-bg);
+      border-left: 1px solid var(--color-success-base);
       &:before {
         content: attr(data-line-number) ' +';
-        color: var(--color-grass-7);
+        color: var(--color-success-active);
       }
     }
     &.remove {
-      background: var(--color-raspberry-2);
+      background: var(--color-error-bg);
+      border-left: 1px solid var(--color-error-base);
 
       &:before {
         content: attr(data-line-number) ' -';
-        color: var(--color-raspberry-7);
+        color: var(--color-error-active);
       }
     }
   }

package/lib/components/CodeBlock/variables.dark.d.ts

@@ -0,0 +1 @@
+export declare const codeBlockDarkMode: import("styled-components").FlattenSimpleInterpolation;

package/lib/components/CodeBlock/variables.dark.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.codeBlockDarkMode = void 0;
+const styled_components_1 = require("styled-components");
+exports.codeBlockDarkMode = (0, styled_components_1.css) `
+  --code-block-highlighted-bg-color: var(--color-brand-subtle-2, var(--code-block-highlighted-bg-color-legacy)); // @presenter Color
+`;
+//# sourceMappingURL=variables.dark.js.map

package/lib/components/CodeBlock/variables.js

@@ -62,6 +62,8 @@ exports.code = (0, styled_components_1.css) `
   --code-block-margin: 0;
   --code-block-max-height: calc(100vh - 300px); // Where 300 is combined value of navbar, code block heading, controls height and paddings
   --code-block-word-break: initial;
+  --code-block-highlighted-border-left: 1px solid var(--color-primary-base, var(--color-warm-grey-11)); // @presenter Color
+  --code-block-highlighted-bg-color: var(--color-primary-bg, var(--code-block-highlighted-bg-color-legacy)); // @presenter Color
 
   /**
     * @tokens Code Block controls
@@ -93,7 +95,7 @@ exports.code = (0, styled_components_1.css) `
   --code-block-tokens-constant-color: var(--code-block-tokens-default-color); // @presenter Color
   --code-block-tokens-symbol-color: var(--code-block-tokens-default-color); // @presenter Color
   --code-block-tokens-boolean-color: var(--color-green-7); // @presenter Color
-  --code-block-tokens-string-color: var(--color-blue-7); // @presenter Color
+  --code-block-tokens-string-color: var(--color-primary-active, var(--code-block-tokens-string-color-legacy)); // @presenter Color
   --code-block-tokens-property-string-color: var(--color-blue-7); // @presenter Color
   --code-block-tokens-selector-color: var(--code-block-tokens-string-color); // @presenter Color
   --code-block-tokens-attr-name-color: var(--code-block-tokens-string-color); // @presenter Color

package/lib/components/Markdown/styles/links.js

@@ -5,12 +5,13 @@ const styled_components_1 = require("styled-components");
 exports.markdownLinksCss = (0, styled_components_1.css) `
   a:not([role='button']) {
     text-decoration: var(--link-decoration);
+    text-underline-offset: var(--link-underline-offset);
     color: var(--link-color-primary);
     font-weight: var(--link-font-weight);
 
     &:visited {
       color: var(--link-color-visited);
-      text-decoration: var(--link-visited-decoration);
+      text-decoration: var(--link-decoration-visited);
     }
 
     &:hover,

package/lib/components/Menu/MenuItem.js

@@ -174,7 +174,7 @@ const MenuItemNestedWrapper = styled_components_1.default.div `
         (var(--menu-item-label-chevron-size) / 2 - 1px) +
         var(--menu-item-nested-offset) * ${depth})
       `};
-    border: 0.5px solid var(--border-color-primary);
+    border: 0.5px solid var(--menu-item-border-color-hover);
   }
 `;
 const MenuItemLabelWrapper = styled_components_1.default.li `
@@ -196,6 +196,18 @@ const MenuItemLabelWrapper = styled_components_1.default.li `
       ${depth ? 'var(--menu-item-nested-offset) * ' + depth : '0px'}
     )`};
 
+  &:hover {
+    color: var(--menu-item-color-hover);
+    background: var(--menu-item-bg-color-hover);
+
+    ${ChevronDownIcon_1.ChevronDownIcon} path {
+      fill: var(--menu-item-color-hover);
+    }
+    ${ChevronRightIcon_1.ChevronRightIcon} path {
+      fill: var(--menu-item-color-hover);
+    }
+  }
+
   ${({ active, deprecated }) => active &&
     (0, styled_components_1.css) `
       color: ${deprecated ? 'var(--menu-content-color-disabled)' : 'var(--menu-item-color-active)'};
@@ -210,7 +222,8 @@ const MenuItemLabelWrapper = styled_components_1.default.li `
       }
 
       &:hover {
-        background: var(--menu-item-bg-color-active);
+        color: var(--menu-item-color-active-hover);
+        background: var(--menu-item-bg-color-active-hover);
       }
     `};
 
@@ -223,30 +236,6 @@ const MenuItemLabelWrapper = styled_components_1.default.li `
       }
     `};
 
-  &:hover {
-    color: var(--menu-item-color-hover);
-    background: var(--menu-item-bg-color-hover);
-
-    ${ChevronDownIcon_1.ChevronDownIcon} path {
-      fill: var(--menu-item-color-hover);
-    }
-    ${ChevronRightIcon_1.ChevronRightIcon} path {
-      fill: var(--menu-item-color-hover);
-    }
-  }
-
-  &:active {
-    color: var(--menu-item-color-active);
-    background: var(--menu-item-bg-color-active);
-
-    ${ChevronDownIcon_1.ChevronDownIcon} path {
-      fill: var(--menu-item-color-active);
-    }
-    ${ChevronRightIcon_1.ChevronRightIcon} path {
-      fill: var(--menu-item-color-active);
-    }
-  }
-
   &:empty {
     padding: 0;
   }

package/lib/components/Menu/variables.dark.js

@@ -9,5 +9,7 @@ exports.menuDarkMode = (0, styled_components_1.css) `
   --menu-content-color-disabled: var(--text-color-disabled); // @presenter Color
 
   --menu-item-bg-color-active: var(--color-primary-bg, var(--menu-item-bg-color-active-legacy)); // @presenter Color
+
+  --menu-item-border-color-hover: color-mix(in srgb, var(--color-black) 8%, transparent); // @presenter Color
 `;
 //# sourceMappingURL=variables.dark.js.map

package/lib/components/Menu/variables.js

@@ -35,7 +35,9 @@ exports.menu = (0, styled_components_1.css) `
 
   --menu-item-color-hover: var(--tree-content-color-hover); // @presenter Color
   --menu-item-color-active: var(--color-primary-text, var(--menu-item-color-active-legacy)); // @presenter Color
-  
+  --menu-item-color-active-hover: var(--color-primary-text, var(--menu-item-color-active-hover-legacy)); // @presenter Color
+  --menu-item-bg-color-active-hover: var(--color-primary-bg, var(--menu-item-bg-color-active-hover-legacy)); // @presenter Color
+  --menu-item-border-color-hover: color-mix(in srgb, var(--color-warm-grey-11) 6%, transparent); // @presenter Color
   /**
    * @tokens Menu item spacing
    * @presenter Spacing

package/lib/components/PageActions/PageActions.js

@@ -112,6 +112,7 @@ const PageActionsWrapper = styled_components_1.default.div `
 `;
 const LinkMenuItem = (0, styled_components_1.default)(Link_1.Link) `
   text-decoration: none;
+  --link-decoration: none;
   --link-decoration-hover: none;
 `;
 const StyledDropdown = (0, styled_components_1.default)(Dropdown_1.Dropdown) `

package/lib/components/PageNavigation/NavigationButton.js

@@ -7,26 +7,34 @@ exports.NavigationButton = NavigationButton;
 const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 const ArrowRightIcon_1 = require("../../icons/ArrowRightIcon/ArrowRightIcon");
-const Button_1 = require("../../components/Button/Button");
 const ArrowLeftIcon_1 = require("../../icons/ArrowLeftIcon/ArrowLeftIcon");
+const Button_1 = require("../../components/Button/Button");
 function NavigationButton({ label, link, text, translationKey, position, icon = position === 'left' ? react_1.default.createElement(ArrowLeftIcon_1.ArrowLeftIcon, null) : react_1.default.createElement(ArrowRightIcon_1.ArrowRightIcon, null), className, }) {
     return (react_1.default.createElement(NavigationButtonWrapper, { "data-component-name": "PageNavigation/NavigationButton", "data-translation-key": translationKey, position: position },
-        react_1.default.createElement(NavigationButtonLabel, null, text),
-        react_1.default.createElement(StyledNavigationButton, { size: "large", to: link, extraClass: className, variant: "link", icon: icon, iconPosition: position }, label)));
+        react_1.default.createElement(PageNavigationTitle, null, label),
+        react_1.default.createElement(Button_1.Button, { to: link, extraClass: className, variant: "link", icon: icon, iconPosition: position }, text)));
 }
 const NavigationButtonWrapper = styled_components_1.default.div `
   display: flex;
   flex-direction: column;
+  width: var(--page-navigation-button-width);
   text-align: ${({ position }) => position};
+  padding: var(--page-navigation-button-padding);
+  gap: var(--page-navigation-button-gap);
+  border: var(--page-navigation-button-border);
+  border-radius: var(--page-navigation-button-border-radius);
+  min-width: var(--page-navigation-button-min-width);
+
+  &:hover {
+    border: var(--page-navigation-button-border-hover);
+  }
 `;
-const StyledNavigationButton = (0, styled_components_1.default)(Button_1.Button) `
+const PageNavigationTitle = styled_components_1.default.p `
+  font-size: var(--page-navigation-button-title-font-size);
+  font-weight: var(--page-navigation-button-title-font-weight);
+  line-height: var(--page-navigation-button-title-line-height);
+  color: var(--page-navigation-button-title-color);
   text-wrap: wrap;
-  padding-left: 0;
-  padding-right: 0;
-`;
-const NavigationButtonLabel = styled_components_1.default.span `
-  font-size: var(--font-size-sm);
-  line-height: var(--line-height-sm);
-  font-weight: var(--font-weight-regular);
+  margin: 0;
 `;
 //# sourceMappingURL=NavigationButton.js.map

package/lib/components/PageNavigation/PageNavigation.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.PageNavigation = PageNavigation;
 const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
+const utils_1 = require("../../core/utils");
 const hooks_1 = require("../../core/hooks");
 const NextButton_1 = require("../../components/PageNavigation/NextButton");
 const PreviousButton_1 = require("../../components/PageNavigation/PreviousButton");
@@ -24,9 +25,14 @@ const PageNavigationWrapper = styled_components_1.default.div `
   justify-content: space-between;
   margin: 25px 0;
   width: 100%;
+  gap: var(--page-navigations-wrapper-gap);
 
   @media print {
     display: none;
   }
+
+  @media screen and (max-width: ${utils_1.breakpoints.small}) {
+    flex-direction: column;
+  }
 `;
 //# sourceMappingURL=PageNavigation.js.map

package/lib/components/PageNavigation/variables.d.ts

@@ -0,0 +1 @@
+export declare const pageNavigation: import("styled-components").FlattenSimpleInterpolation;

package/lib/components/PageNavigation/variables.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.pageNavigation = void 0;
+const styled_components_1 = require("styled-components");
+exports.pageNavigation = (0, styled_components_1.css) `
+  /**
+   * @tokens Page Navigation
+   */
+
+  --page-navigations-wrapper-gap: var(--spacing-base); // @presenter Spacing
+
+  --page-navigation-button-width: var(--container-max-width); // @presenter Width
+  --page-navigation-button-padding: var(--spacing-sm) var(--spacing-base); // @presenter Spacing
+  --page-navigation-button-title-font-size: var(--font-size-lg); // @presenter FontSize
+  --page-navigation-button-title-font-weight: var(--font-weight-medium); // @presenter FontWeight
+  --page-navigation-button-title-line-height: var(--line-height-lg); // @presenter LineHeight
+  --page-navigation-button-title-color: var(--text-color-primary); // @presenter Color
+  --page-navigation-button-gap: var(--spacing-xxs); // @presenter Spacing
+  --page-navigation-button-border-radius: var(--border-radius-xl); // @presenter BorderRadius
+  --page-navigation-button-border-color: var(--border-color-secondary); // @presenter Color
+  --page-navigation-button-border: var(--border-width) var(--border-style) var(--page-navigation-button-border-color); // @presenter Border
+  --page-navigation-button-border-color-hover: var(--color-primary-base, var(--color-warm-grey-11)); // @presenter Color
+  --page-navigation-button-border-hover: var(--border-width) var(--border-style) var(--page-navigation-button-border-color-hover); // @presenter Border
+  --page-navigation-button-min-width: 220px; // @presenter Width
+  // @tokens End
+`;
+//# sourceMappingURL=variables.js.map

package/lib/components/Search/variables.js

@@ -166,7 +166,7 @@ exports.search = (0, styled_components_1.css) `
   --search-ai-text-line-height: var(--line-height-lg);
   --search-ai-thinking-text-margin: var(--md-pre-margin) 0;
 
-  --search-ai-user-bg-color: var(--color-blue-6);
+  --search-ai-user-bg-color: var(--color-primary-base, var(--search-ai-user-bg-color-legacy));
   --search-ai-user-text-color: var(--color-static-white);
   --search-ai-assistant-bg-color: var(--layer-color);
   --search-ai-assistant-text-color: var(--text-color-primary);
@@ -249,7 +249,7 @@ exports.search = (0, styled_components_1.css) `
   --search-ai-conversation-input-border-radius: var(--border-radius-lg);
   --search-ai-conversation-input-font-size: var(--font-size-base);
   --search-ai-conversation-input-placeholder-color: var(--search-input-placeholder-color);
-  --search-ai-conversation-input-border-color-focus: var(--color-blue-6);
+  --search-ai-conversation-input-border-color-focus: var(--color-primary-base, var(--search-ai-conversation-input-border-color-focus-legacy));
   --search-ai-conversation-input-border-color-disabled: var(--border-color-secondary);
 
   --search-ai-conversation-input-send-button-right: 12px;

package/lib/core/hooks/use-modal-scroll-lock.js

@@ -3,25 +3,32 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useModalScrollLock = useModalScrollLock;
 const react_1 = require("react");
 function useModalScrollLock(isOpen) {
+    const originalBodyStylesRef = (0, react_1.useRef)(null);
     (0, react_1.useEffect)(() => {
         if (typeof window === 'undefined' || typeof document === 'undefined') {
             return;
         }
         const { body, documentElement } = document;
-        const originalOverflow = body.style.overflow;
-        const originalPaddingRight = body.style.paddingRight;
-        const originalScrollbarWidth = documentElement.style.getPropertyValue('--modal-scrollbar-width');
-        const restoreScrollState = () => {
-            body.style.overflow = originalOverflow;
-            body.style.paddingRight = originalPaddingRight;
-            if (originalScrollbarWidth) {
-                documentElement.style.setProperty('--modal-scrollbar-width', originalScrollbarWidth);
+        const restoreOriginalBodyStyles = () => {
+            if (!originalBodyStylesRef.current)
+                return;
+            const { overflow, paddingRight, scrollbarWidth } = originalBodyStylesRef.current;
+            body.style.overflow = overflow;
+            body.style.paddingRight = paddingRight;
+            if (scrollbarWidth) {
+                documentElement.style.setProperty('--modal-scrollbar-width', scrollbarWidth);
             }
             else {
                 documentElement.style.removeProperty('--modal-scrollbar-width');
             }
+            originalBodyStylesRef.current = null;
         };
-        if (isOpen) {
+        if (isOpen && !originalBodyStylesRef.current) {
+            originalBodyStylesRef.current = {
+                overflow: body.style.overflow,
+                paddingRight: body.style.paddingRight,
+                scrollbarWidth: documentElement.style.getPropertyValue('--modal-scrollbar-width') || null,
+            };
             const scrollbarWidth = window.innerWidth - documentElement.clientWidth;
             body.style.overflow = 'hidden';
             if (scrollbarWidth > 0) {
@@ -29,8 +36,12 @@ function useModalScrollLock(isOpen) {
                 documentElement.style.setProperty('--modal-scrollbar-width', `${scrollbarWidth}px`);
             }
         }
+        else if (!isOpen && originalBodyStylesRef.current) {
+            restoreOriginalBodyStyles();
+        }
+        // Cleanup only if component unmounts while modal is open
         return () => {
-            restoreScrollState();
+            restoreOriginalBodyStyles();
         };
     }, [isOpen]);
 }

package/lib/core/hooks/use-page-actions.js

@@ -40,21 +40,17 @@ const DEFAULT_ENABLED_ACTIONS = [
     'docs-mcp-vscode',
 ];
 function usePageActions(pageSlug, mcpUrl, actions) {
-    var _a, _b, _c;
+    var _a;
     const { useTranslate, usePageData, usePageProps, usePageSharedData, useTelemetry } = (0, use_theme_hooks_1.useThemeHooks)();
     const { translate } = useTranslate();
     const themeConfig = (0, use_theme_config_1.useThemeConfig)();
     const pageProps = usePageProps();
     const telemetry = useTelemetry();
     const openApiSharedData = usePageSharedData('openAPIDocsStore');
+    const openapiExcludeFromSearch = (_a = openApiSharedData === null || openApiSharedData === void 0 ? void 0 : openApiSharedData.options) === null || _a === void 0 ? void 0 : _a.excludeFromSearch;
     const mcpConfig = (0, use_mcp_config_1.useMCPConfig)();
-    const shouldHideAllActions = shouldHidePageActions(pageProps, themeConfig, (_a = openApiSharedData === null || openApiSharedData === void 0 ? void 0 : openApiSharedData.options) === null || _a === void 0 ? void 0 : _a.excludeFromSearch);
     const { isPublic } = usePageData() || {};
     const createMCPHandler = (0, react_1.useCallback)((clientType, requiresMcpUrl = false) => () => {
-        if (requiresMcpUrl && !mcpUrl)
-            return null;
-        if (!requiresMcpUrl && (mcpUrl || mcpConfig.isMcpDisabled))
-            return null;
         const config = requiresMcpUrl
             ? { serverName: mcpConfig.serverName, url: mcpUrl || '' }
             : { serverName: mcpConfig.serverName, url: mcpConfig.serverUrl || '' };
@@ -74,9 +70,14 @@ function usePageActions(pageSlug, mcpUrl, actions) {
     }, [mcpUrl, mcpConfig, translate, telemetry, pageSlug]);
     const result = (0, react_1.useMemo)(() => {
         var _a, _b, _c;
-        if (shouldHideAllActions) {
-            return [];
-        }
+        const hideActionContext = {
+            pageProps,
+            themeConfig,
+            openapiExcludeFromSearch,
+            isPublic,
+            mcpUrl,
+            isMcpDisabled: mcpConfig.isMcpDisabled,
+        };
         const origin = dom_1.IS_BROWSER
             ? window.location.origin
             : ((_a = globalThis['SSR_HOSTNAME']) !== null && _a !== void 0 ? _a : '');
@@ -126,9 +127,6 @@ function usePageActions(pageSlug, mcpUrl, actions) {
                 },
             }),
             chatgpt: () => {
-                if (!isPublic) {
-                    return null;
-                }
                 const link = getExternalAiPromptLink('https://chat.openai.com', mdPageUrl);
                 return {
                     buttonText: translate('page.actions.chatGptButtonText', 'Open in ChatGPT'),
@@ -145,9 +143,6 @@ function usePageActions(pageSlug, mcpUrl, actions) {
                 };
             },
             claude: () => {
-                if (!isPublic) {
-                    return null;
-                }
                 const link = getExternalAiPromptLink('https://claude.ai/new', mdPageUrl);
                 return {
                     buttonText: translate('page.actions.claudeButtonText', 'Open in Claude'),
@@ -165,15 +160,18 @@ function usePageActions(pageSlug, mcpUrl, actions) {
             },
         };
         return (((_c = (_b = themeConfig.navigation) === null || _b === void 0 ? void 0 : _b.actions) === null || _c === void 0 ? void 0 : _c.items) || actions || DEFAULT_ENABLED_ACTIONS)
-            .map((action) => { var _a; return (_a = actionHandlers[action]) === null || _a === void 0 ? void 0 : _a.call(actionHandlers); })
-            .filter((action) => action !== null);
+            .filter((action) => !shouldHideAction(action, hideActionContext))
+            .map((action) => actionHandlers[action]());
     }, [
-        shouldHideAllActions,
+        pageProps,
+        themeConfig,
+        openapiExcludeFromSearch,
+        isPublic,
+        mcpUrl,
+        mcpConfig.isMcpDisabled,
         pageSlug,
-        (_c = (_b = themeConfig.navigation) === null || _b === void 0 ? void 0 : _b.actions) === null || _c === void 0 ? void 0 : _c.items,
         actions,
         translate,
-        isPublic,
         createMCPHandler,
         telemetry,
     ]);
@@ -198,7 +196,7 @@ function createMCPAction({ clientType, mcpConfig, translate, onClickCallback, })
     }
     return Object.assign(Object.assign({}, sharedProps), { buttonText: translate('page.actions.connectMcp.vscode', 'Connect to VS Code'), title: translate('page.actions.connectMcp.vscode', 'Connect to VS Code'), description: translate('page.actions.connectMcp.vscodeDescription', 'Install MCP server on VS Code'), iconComponent: VSCodeIcon_1.VSCodeIcon });
 }
-function shouldHidePageActions(pageProps, themeConfig, openapiExcludeFromSearch) {
+function shouldHideAction(action, { pageProps, themeConfig, openapiExcludeFromSearch, isPublic, mcpUrl, isMcpDisabled, }) {
     var _a, _b, _c, _d, _e, _f, _g, _h;
     // Can't use any actions if search is globally disabled (markdown files are not generated)
     if ((_a = themeConfig.search) === null || _a === void 0 ? void 0 : _a.hide) {
@@ -212,12 +210,33 @@ function shouldHidePageActions(pageProps, themeConfig, openapiExcludeFromSearch)
     if ((_e = (_d = themeConfig.navigation) === null || _d === void 0 ? void 0 : _d.actions) === null || _e === void 0 ? void 0 : _e.hide) {
         return true;
     }
-    // Page is excluded from search
     const isOpenApiPage = ((_f = pageProps === null || pageProps === void 0 ? void 0 : pageProps.metadata) === null || _f === void 0 ? void 0 : _f.type) === 'openapi' || ((_g = pageProps === null || pageProps === void 0 ? void 0 : pageProps.metadata) === null || _g === void 0 ? void 0 : _g.subType) === 'openapi-operation';
     const isPageExcludedFromSearch = ((_h = pageProps === null || pageProps === void 0 ? void 0 : pageProps.frontmatter) === null || _h === void 0 ? void 0 : _h.excludeFromSearch) || (isOpenApiPage && openapiExcludeFromSearch);
-    if (isPageExcludedFromSearch) {
+    // Page excluded from search: only explicit MCP connect actions remain visible,
+    // since they don't depend on the page's markdown.
+    if (isPageExcludedFromSearch && action !== 'mcp-cursor' && action !== 'mcp-vscode') {
         return true;
     }
-    return false;
+    return shouldHideActionByType(action, { isPublic, mcpUrl, isMcpDisabled });
+}
+function shouldHideActionByType(action, { isPublic, mcpUrl, isMcpDisabled, }) {
+    switch (action) {
+        case 'chatgpt':
+        case 'claude':
+            return !isPublic;
+        case 'docs-mcp-cursor':
+        case 'docs-mcp-vscode':
+            return Boolean(mcpUrl) || isMcpDisabled;
+        case 'mcp-cursor':
+        case 'mcp-vscode':
+            return !mcpUrl;
+        case 'copy':
+        case 'view':
+            return false;
+        default: {
+            action;
+            return true;
+        }
+    }
 }
 //# sourceMappingURL=use-page-actions.js.map

package/lib/core/styles/dark.js

@@ -17,6 +17,7 @@ const variables_dark_12 = require("../../components/PageActions/variables.dark")
 const variables_dark_13 = require("../../components/Tooltip/variables.dark");
 const variables_dark_14 = require("../../components/Banner/variables.dark");
 const variables_dark_15 = require("../../components/Admonition/variables.dark");
+const variables_dark_16 = require("../../components/CodeBlock/variables.dark");
 const palette_dark_1 = require("./palette.dark");
 const replayDarkMode = (0, styled_components_1.css) `
   /**
@@ -290,10 +291,10 @@ exports.darkMode = (0, styled_components_1.css) `
   * @tokens Links
   */
 
-  --link-color-primary: var(--color-blue-7); // @presenter Color
-  --link-color-primary-hover: var(--color-blue-8); // @presenter Color
+  --link-color-primary: var(--link-color-primary-palette, var(--link-color-primary-legacy)); // @presenter Color
+  --link-color-primary-hover: var(--link-color-primary-palette, var(--link-color-primary-hover-legacy)); // @presenter Color
   --link-color-inverse: var(--color-blue-6); // @presenter Color
-  --link-color-visited: var(--color-purple-8); // @presenter Color
+  --link-color-visited: var(--link-color-primary-palette, var(--link-color-visited-legacy)); // @presenter Color
 
   /**
   * @tokens Tab Colors
@@ -349,6 +350,7 @@ exports.darkMode = (0, styled_components_1.css) `
   ${variables_dark_15.admonitionDarkMode}
   ${badgesDarkMode}
   ${palette_dark_1.activeBrandPaletteDark}
+  ${variables_dark_16.codeBlockDarkMode}
   /**
     * @tokens Dark Theme Scrollbar Config
     * @presenter Color