@redocly/theme 0.71.0-next.3 → 0.71.0-next.5

package/lib/components/Buttons/MobileMenuButton.d.ts

@@ -0,0 +1,8 @@
+import type { JSX } from 'react';
+export type MobileMenuButtonProps = {
+    isOpen: boolean;
+    /** Called inside a transition; the button shows the requested state until it commits. */
+    onOpenChange: (isOpen: boolean) => void;
+    className?: string;
+};
+export declare function MobileMenuButton({ isOpen, onOpenChange, className, }: MobileMenuButtonProps): JSX.Element;

package/lib/components/Buttons/MobileMenuButton.js

@@ -0,0 +1,58 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MobileMenuButton = MobileMenuButton;
+const react_1 = __importStar(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const utils_1 = require("../../core/utils");
+const Button_1 = require("../../components/Button/Button");
+const MenuIcon_1 = require("../../icons/MenuIcon/MenuIcon");
+const CloseIcon_1 = require("../../icons/CloseIcon/CloseIcon");
+function MobileMenuButton({ isOpen, onOpenChange, className, }) {
+    const [isToggling, startToggle] = (0, react_1.useTransition)();
+    const showClose = isToggling ? !isOpen : isOpen;
+    return (react_1.default.createElement(MobileMenuButtonWrapper, { "data-component-name": "Buttons/MobileMenuButton", className: className, variant: "text", "data-testid": "mobile-menu-button", onClick: () => startToggle(() => onOpenChange(!showClose)), icon: showClose ? react_1.default.createElement(CloseIcon_1.CloseIcon, null) : react_1.default.createElement(MenuIcon_1.MenuIcon, null), "aria-label": showClose ? 'Close menu button' : 'Open menu button' }));
+}
+const MobileMenuButtonWrapper = (0, styled_components_1.default)(Button_1.Button) `
+  margin-left: 0px !important;
+
+  @media screen and (min-width: ${utils_1.breakpoints.medium}) {
+    display: none;
+  }
+`;
+//# sourceMappingURL=MobileMenuButton.js.map

package/lib/components/Catalog/CatalogFilter/CatalogFilter.js

@@ -21,7 +21,7 @@ function CatalogFilter({ filter, filterValuesCasing, showCounter = true, classNa
     if (!filteredOptions || filteredOptions.length === 0) {
         return null;
     }
-    const FilterComponent = filterComponents[(filter.type || 'checkboxes')];
+    const FilterComponent = filterComponents[filter.type || 'checkboxes'];
     return (react_1.default.createElement(CatalogFilterGroup, { className: className, "data-component-name": "Catalog/CatalogFilter", key: filter.property + filter.title },
         react_1.default.createElement(FilterComponent, { filter: filter, filterValuesCasing: filterValuesCasing, showCounter: showCounter })));
 }

package/lib/components/Navbar/Navbar.js

@@ -50,9 +50,7 @@ const Search_1 = require("../../components/Search/Search");
 const UserMenu_1 = require("../../components/UserMenu/UserMenu");
 const LanguagePicker_1 = require("../../components/LanguagePicker/LanguagePicker");
 const ProductPicker_1 = require("../../components/Product/ProductPicker");
-const Button_1 = require("../../components/Button/Button");
-const MenuIcon_1 = require("../../icons/MenuIcon/MenuIcon");
-const CloseIcon_1 = require("../../icons/CloseIcon/CloseIcon");
+const MobileMenuButton_1 = require("../../components/Buttons/MobileMenuButton");
 const Banner_1 = require("../../components/Banner/Banner");
 function Navbar({ className }) {
     var _a;
@@ -81,19 +79,20 @@ function Navbar({ className }) {
             hideSearch ? null : react_1.default.createElement(Search_1.Search, null),
             react_1.default.createElement(LanguagePicker_1.LanguagePicker, { onChangeLanguage: changeLanguage, onlyIcon: true, alignment: "end" }),
             react_1.default.createElement(ColorModeSwitcher_1.ColorModeSwitcher, null),
-            react_1.default.createElement(MobileMenuButton, { variant: "text", "data-testid": "mobile-menu-button", onClick: isOpen
-                    ? () => {
+            react_1.default.createElement(MobileMenuButton_1.MobileMenuButton, { isOpen: isOpen, onOpenChange: (open) => {
+                    if (open) {
+                        openMobileMenu();
+                        telemetry.sendMobileMenuOpenedMessage([
+                            (0, utils_1.getBaseDataAttributes)('mobileMenuOpen', 'button'),
+                        ]);
+                    }
+                    else {
                         closeMobileMenu();
                         telemetry.sendMobileMenuClosedMessage([
                             (0, utils_1.getBaseDataAttributes)('mobileMenuClose', 'button'),
                         ]);
                     }
-                    : () => {
-                        openMobileMenu();
-                        telemetry.sendMobileMenuOpenedMessage([
-                            (0, utils_1.getBaseDataAttributes)('mobileMenuOpen', 'button'),
-                        ]);
-                    }, icon: isOpen ? react_1.default.createElement(CloseIcon_1.CloseIcon, null) : react_1.default.createElement(MenuIcon_1.MenuIcon, null), "aria-label": isOpen ? 'Close menu button' : 'Open menu button' }),
+                } }),
             hideUserMenu ? null : react_1.default.createElement(UserMenu_1.UserMenu, null)),
         navigationTabsConfig && react_1.default.createElement(NavigationTabs_1.NavigationTabs, { config: navigationTabsConfig })));
 }
@@ -147,11 +146,4 @@ const NavbarRow = styled_components_1.default.div `
     margin-right: auto;
   }
 `;
-const MobileMenuButton = (0, styled_components_1.default)(Button_1.Button) `
-  margin-left: 0px !important;
-
-  @media screen and (min-width: ${utils_1.breakpoints.medium}) {
-    display: none;
-  }
-`;
 //# sourceMappingURL=Navbar.js.map

package/lib/core/hooks/use-focus-trap.js

@@ -2,15 +2,18 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useFocusTrap = useFocusTrap;
 const react_1 = require("react");
+const FOCUSABLE_SELECTOR = 'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])';
 function useFocusTrap(containerRef) {
     (0, react_1.useEffect)(() => {
+        var _a;
         const trapElement = containerRef.current;
         if (!trapElement)
             return;
-        const focusableElements = trapElement.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
-        const firstElement = focusableElements[0];
+        const getFocusableElements = () => trapElement.querySelectorAll(FOCUSABLE_SELECTOR);
         const handleKeyDown = (event) => {
             if (event.key === 'Tab') {
+                const focusableElements = getFocusableElements();
+                const firstElement = focusableElements[0];
                 const lastElement = focusableElements[focusableElements.length - 1];
                 if (event.shiftKey && document.activeElement === firstElement) {
                     lastElement === null || lastElement === void 0 ? void 0 : lastElement.focus();
@@ -23,9 +26,7 @@ function useFocusTrap(containerRef) {
             }
         };
         trapElement.addEventListener('keydown', handleKeyDown);
-        if (firstElement) {
-            firstElement.focus();
-        }
+        (_a = getFocusableElements()[0]) === null || _a === void 0 ? void 0 : _a.focus();
         return () => {
             trapElement.removeEventListener('keydown', handleKeyDown);
         };

package/lib/core/hooks/use-page-actions.d.ts

@@ -1,3 +1,3 @@
 import type { PageAction } from '../types';
-export type PageActionType = 'copy' | 'view' | 'chatgpt' | 'claude' | 'docs-mcp-cursor' | 'docs-mcp-vscode' | 'docs-mcp-claude' | 'mcp-cursor' | 'mcp-vscode';
+export type PageActionType = 'copy' | 'view' | 'chatgpt' | 'claude' | 'grok' | 'docs-mcp-cursor' | 'docs-mcp-vscode' | 'docs-mcp-claude' | 'mcp-cursor' | 'mcp-vscode';
 export declare function usePageActions(pageSlug: string, mcpUrl?: string, actions?: PageActionType[]): PageAction[];

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

@@ -14,6 +14,7 @@ const react_1 = require("react");
 const CopyIcon_1 = require("../../icons/CopyIcon/CopyIcon");
 const ChatGptIcon_1 = require("../../icons/ChatGptIcon/ChatGptIcon");
 const ClaudeIcon_1 = require("../../icons/ClaudeIcon/ClaudeIcon");
+const GrokIcon_1 = require("../../icons/GrokIcon/GrokIcon");
 const MarkdownFullIcon_1 = require("../../icons/MarkdownFullIcon/MarkdownFullIcon");
 const VSCodeIcon_1 = require("../../icons/VSCodeIcon/VSCodeIcon");
 const CursorIcon_1 = require("../../icons/CursorIcon/CursorIcon");
@@ -31,6 +32,7 @@ const DEFAULT_ENABLED_ACTIONS = [
     'view',
     'chatgpt',
     'claude',
+    'grok',
     'docs-mcp-cursor',
     'docs-mcp-vscode',
     'docs-mcp-claude',
@@ -84,6 +86,16 @@ function usePageActions(pageSlug, mcpUrl, actions) {
             ? (0, urls_1.combineUrls)(origin, pathname, 'index.html.md')
             : (0, urls_1.combineUrls)(origin, (0, urls_1.removeTrailingSlash)(pathname) + '.md');
         const externalAiPrompt = `Read ${mdPageUrl} and answer questions based on the content.`;
+        const createAiPromptAction = (target, iconComponent, texts) => () => {
+            const link = (0, get_ai_prompt_link_1.getAiPromptLink)(target, externalAiPrompt);
+            return Object.assign(Object.assign({}, texts), { iconComponent,
+                link, onClick: () => {
+                    telemetry.sendPageActionsClickedMessage([
+                        Object.assign(Object.assign({}, (0, get_base_data_attributes_1.getBaseDataAttributes)('pageActions', 'button')), { actionType: target }),
+                    ]);
+                    window.location.href = link;
+                } });
+        };
         const actionHandlers = {
             'docs-mcp-cursor': createMCPHandler('cursor', false),
             'docs-mcp-vscode': createMCPHandler('vscode', false),
@@ -124,38 +136,21 @@ function usePageActions(pageSlug, mcpUrl, actions) {
                     ]);
                 },
             }),
-            chatgpt: () => {
-                const link = (0, get_ai_prompt_link_1.getAiPromptLink)('chatgpt', externalAiPrompt);
-                return {
-                    buttonText: translate('page.actions.chatGptButtonText', 'Open in ChatGPT'),
-                    title: translate('page.actions.chatGptTitle', 'Open in ChatGPT'),
-                    description: translate('page.actions.chatGptDescription', 'Get insights from ChatGPT'),
-                    iconComponent: ChatGptIcon_1.ChatGptIcon,
-                    link,
-                    onClick: () => {
-                        telemetry.sendPageActionsClickedMessage([
-                            Object.assign(Object.assign({}, (0, get_base_data_attributes_1.getBaseDataAttributes)('pageActions', 'button')), { actionType: 'chatgpt' }),
-                        ]);
-                        window.location.href = link;
-                    },
-                };
-            },
-            claude: () => {
-                const link = (0, get_ai_prompt_link_1.getAiPromptLink)('claude', externalAiPrompt);
-                return {
-                    buttonText: translate('page.actions.claudeButtonText', 'Open in Claude'),
-                    title: translate('page.actions.claudeTitle', 'Open in Claude'),
-                    description: translate('page.actions.claudeDescription', 'Get insights from Claude'),
-                    iconComponent: ClaudeIcon_1.ClaudeIcon,
-                    link,
-                    onClick: () => {
-                        telemetry.sendPageActionsClickedMessage([
-                            Object.assign(Object.assign({}, (0, get_base_data_attributes_1.getBaseDataAttributes)('pageActions', 'button')), { actionType: 'claude' }),
-                        ]);
-                        window.location.href = link;
-                    },
-                };
-            },
+            chatgpt: createAiPromptAction('chatgpt', ChatGptIcon_1.ChatGptIcon, {
+                buttonText: translate('page.actions.chatGptButtonText', 'Open in ChatGPT'),
+                title: translate('page.actions.chatGptTitle', 'Open in ChatGPT'),
+                description: translate('page.actions.chatGptDescription', 'Get insights from ChatGPT'),
+            }),
+            claude: createAiPromptAction('claude', ClaudeIcon_1.ClaudeIcon, {
+                buttonText: translate('page.actions.claudeButtonText', 'Open in Claude'),
+                title: translate('page.actions.claudeTitle', 'Open in Claude'),
+                description: translate('page.actions.claudeDescription', 'Get insights from Claude'),
+            }),
+            grok: createAiPromptAction('grok', GrokIcon_1.GrokIcon, {
+                buttonText: translate('page.actions.grokButtonText', 'Open in Grok'),
+                title: translate('page.actions.grokTitle', 'Open in Grok'),
+                description: translate('page.actions.grokDescription', 'Get insights from Grok'),
+            }),
         };
         return (((_b = (_a = themeConfig.navigation) === null || _a === void 0 ? void 0 : _a.actions) === null || _b === void 0 ? void 0 : _b.items) || actions || DEFAULT_ENABLED_ACTIONS)
             .filter((action) => !shouldHideAction(action, hideActionContext))
@@ -198,7 +193,7 @@ function shouldHideAction(action, { pageProps, themeConfig, apiDocsExcludeFromSe
     if ((_b = (_a = themeConfig.navigation) === null || _a === void 0 ? void 0 : _a.actions) === null || _b === void 0 ? void 0 : _b.hide) {
         return true;
     }
-    const actionDependsOnLlmsTxt = ['view', 'copy', 'chatgpt', 'claude'].includes(action);
+    const actionDependsOnLlmsTxt = ['view', 'copy', 'chatgpt', 'claude', 'grok'].includes(action);
     if (actionDependsOnLlmsTxt) {
         // Can't use any actions if search is globally disabled (markdown files are not generated)
         if ((_c = themeConfig.search) === null || _c === void 0 ? void 0 : _c.hide) {
@@ -219,6 +214,7 @@ function shouldHideActionByType(action, { isPublic, mcpUrl, isMcpDisabled, }) {
     switch (action) {
         case 'chatgpt':
         case 'claude':
+        case 'grok':
             return !isPublic;
         case 'docs-mcp-cursor':
         case 'docs-mcp-vscode':

package/lib/core/styles/dark.js

@@ -65,7 +65,6 @@ const numberedListDarkMode = (0, styled_components_1.css) `
     */
 
   --md-numbered-list-marker-bg-color: var(--color-warm-grey-3); // @presenter Color
-  --md-numbered-list-marker-bg-color-hover: var(--color-warm-grey-4); // @presenter Color
 
   // @tokens End
 `;

package/lib/core/types/l10n.d.ts

@@ -1,5 +1,5 @@
 import type { TOptions } from 'i18next';
-export type TranslationKey = 'dev.newApp' | 'dev.newApp.text' | 'dev.sidebar.header' | 'dev.sidebar.footer.text' | 'dev.create.app.dialog.appName.placeholder' | 'dev.create.app.dialog.appName.error' | 'dev.create.app.dialog.selectAPIs' | 'dev.create.app.dialog.description' | 'dev.create.app.dialog.description.placeholder' | 'dev.create.app.dialog.create' | 'dev.create.app.dialog.cancel' | 'dev.main.tab.appKeys' | 'dev.main.tab.logs' | 'dev.app.description.title' | 'dev.edit.description.dialog.title' | 'dev.edit.description.dialog.save' | 'dev.edit.description.dialog.cancel' | 'dev.create.app.dialog.callbackUrls' | 'dev.create.app.dialog.callbackUrls.placeholder' | 'dev.create.app.dialog.callbackUrls.hint' | 'dev.app.callbackUrls.title' | 'dev.edit.callbackUrls.dialog.title' | 'dev.edit.callbackUrls.dialog.placeholder' | 'dev.edit.callbackUrls.dialog.hint' | 'dev.edit.callbackUrls.dialog.save' | 'dev.edit.callbackUrls.dialog.cancel' | 'dev.edit.apis.dialog.selectedAPIs' | 'dev.app.key.create' | 'dev.create.key.dialog.title' | 'dev.create.key.dialog.create' | 'dev.create.key.dialog.cancel' | 'dev.app.edit' | 'dev.app.delete' | 'dev.edit.app.dialog.title' | 'dev.edit.app.dialog.save' | 'dev.edit.app.dialog.cancel' | 'dev.delete.app.dialog.title' | 'dev.delete.app.dialog.confirmation' | 'dev.delete.app.dialog.delete' | 'dev.delete.app.dialog.cancel' | 'dev.app.key.roll' | 'dev.roll.key.dialog.title' | 'dev.roll.key.dialog.apiKey' | 'dev.roll.key.dialog.expires' | 'dev.roll.key.dialog.confirmation' | 'dev.roll.key.dialog.cancel' | 'dev.roll.key.dialog.roll' | 'dev.update.key.dialog.title' | 'dev.update.key.dialog.update' | 'dev.update.key.dialog.cancel' | 'dev.app.key.api.name' | 'dev.app.key.api.status' | 'dev.app.key.api.edit' | 'dev.edit.apis.dialog.title' | 'dev.edit.apis.dialog.apiKey' | 'dev.edit.apis.dialog.save' | 'dev.edit.apis.dialog.cancel' | 'dev.select.placeholder' | 'dev.app.overview.status.pending' | 'dev.app.overview.status.approved' | 'dev.app.overview.status.revoked' | 'dev.app.overview.status' | 'dev.app.overview.non-production' | 'dev.app.overview.production' | 'dev.app.overview.clientId' | 'dev.app.overview.apiKey' | 'dev.app.key.revoke' | 'dev.revoke.key.dialog.title' | 'dev.revoke.key.dialog.apiKey' | 'dev.revoke.key.dialog.expires' | 'dev.revoke.key.dialog.confirmation' | 'dev.revoke.key.dialog.revoke' | 'dev.revoke.key.dialog.cancel' | 'dev.app.overview.expires' | 'dev.app.overview.created' | 'dev.app.overview.visibilityToggle.hide' | 'dev.app.overview.visibilityToggle.show' | 'search.loading' | 'search.noResults.title' | 'search.keys.navigate' | 'search.keys.select' | 'search.keys.exit' | 'search.label' | 'search.cancel' | 'search.recent' | 'search.navbar.label' | 'search.suggested' | 'search.showMore' | 'search.error.title' | 'search.error.button' | 'search.filter.title' | 'search.filter.reset' | 'search.filter.field.reset' | 'search.ai.welcomeText' | 'search.ai.newConversation' | 'search.ai.backToSearch' | 'search.ai.back' | 'search.ai.assistant' | 'search.ai.placeholder' | 'search.ai.generatingResponse' | 'search.ai.followUpQuestion' | 'search.ai.send' | 'search.ai.suggestionsTitle' | 'search.ai.thinkingText' | 'search.ai.resourcesFound' | 'search.ai.resourcesFound.basedOn' | 'search.ai.resourcesFound.resources' | 'search.ai.feedback.title' | 'search.ai.feedback.detailsPlaceholder' | 'search.ai.feedback.thanks' | 'search.ai.toolCall.executed' | 'search.ai.toolCall.executing' | 'search.ai.toolCall.usedTools' | 'search.ai.button' | 'search.ai.label' | 'search.ai.disclaimer' | 'search.ai.error.description' | 'search.ai.error.description.forbidden' | 'search.ai.error.description.unauthorized' | 'search.ai.error.header' | 'search.ai.error.header.forbidden' | 'search.ai.error.header.unauthorized' | 'search.ai.feedback.more' | 'search.ai.actions.copy' | 'search.ai.actions.like' | 'search.ai.actions.dislike' | 'search.searchItem.deprecated' | 'search.searchItem.enum' | 'search.searchItem.example' | 'search.groups.all' | 'search.filter.field.footer' | 'aiAssistant.trigger' | 'toc.header' | 'footer.copyrightText' | 'page.homeButton' | 'page.forbidden.title' | 'page.forbidden.description' | 'page.notFound.title' | 'page.notFound.description' | 'page.apiNotFound.title' | 'page.apiNotFound.description' | 'page.apiNotFound.hint' | 'page.apiNotFound.backButton' | 'page.mcpNotAllowed.title' | 'page.mcpNotAllowed.description' | 'page.mcpNotAllowed.publicNote' | 'page.mcpNotAllowed.publicEndpointHint' | 'page.mcpNotAllowed.mainEndpointHint' | 'page.mcpNotAllowed.snippets.terminal.hint' | 'page.mcpNotAllowed.snippets.claudeCode.headline' | 'page.mcpNotAllowed.snippets.claudeDesktop.headline' | 'page.mcpNotAllowed.snippets.claudeDesktop.accountHint' | 'page.mcpNotAllowed.snippets.claudeDesktop.instruction' | 'page.mcpNotAllowed.snippets.chatgptApp.headline' | 'page.mcpNotAllowed.snippets.chatgptApp.instruction' | 'page.mcpNotAllowed.snippets.codexCli.headline' | 'page.mcpNotAllowed.snippets.prompt.headline' | 'page.mcpNotAllowed.snippets.prompt.hint' | 'page.mcpNotAllowed.snippets.json.hint' | 'page.mcpNotAllowed.tabs.claude' | 'page.mcpNotAllowed.tabs.chatgpt' | 'page.mcpNotAllowed.tabs.json' | 'page.lastUpdated.timeago' | 'page.lastUpdated.on' | 'catalog.filters.placeholder' | 'catalog.filters.title' | 'catalog.filters.add' | 'catalog.filters.clearAll' | 'catalog.filters.select.addFilter' | 'catalog.filters.select.all' | 'catalog.filters.done' | 'catalog.catalogs.all.title' | 'catalog.catalogs.all.description' | 'catalog.catalogs.all.switcherLabel' | 'catalog.catalogs.service.title' | 'catalog.catalogs.service.description' | 'catalog.catalogs.service.switcherLabel' | 'catalog.catalogs.user.title' | 'catalog.catalogs.user.description' | 'catalog.catalogs.user.switcherLabel' | 'catalog.catalogs.team.title' | 'catalog.catalogs.team.description' | 'catalog.catalogs.team.switcherLabel' | 'catalog.catalogs.domain.title' | 'catalog.catalogs.domain.description' | 'catalog.catalogs.domain.switcherLabel' | 'catalog.catalogs.apiDescription.title' | 'catalog.catalogs.apiDescription.description' | 'catalog.catalogs.apiDescription.switcherLabel' | 'catalog.catalogs.dataSchema.title' | 'catalog.catalogs.dataSchema.description' | 'catalog.catalogs.dataSchema.switcherLabel' | 'catalog.catalogs.apiOperation.title' | 'catalog.catalogs.apiOperation.description' | 'catalog.catalogs.apiOperation.switcherLabel' | 'catalog.entity.metadata.title' | 'catalog.entity.schema.title' | 'catalog.entity.properties.apiDescription.title' | 'catalog.backToAllLabel' | 'catalog.notConnected' | 'catalog.tags.label' | 'catalog.sort' | 'catalog.catalogs.label' | 'catalog.owners.label' | 'catalog.repositories.label' | 'catalog.email.label' | 'catalog.format.label' | 'catalog.entityType.label' | 'catalog.domains.label' | 'catalog.contact.label' | 'catalog.methodAndPath.label' | 'catalog.links.label' | 'catalog.metadata.domains' | 'catalog.metadata.owners' | 'catalog.history.button.label' | 'catalog.history.sidebar.title' | 'catalog.history.sidebar.close' | 'catalog.history.version.label' | 'catalog.filters.close' | 'catalog.history.version.notSpecified' | 'catalog.history.version.default' | 'catalog.history.revisions.limitMessage' | 'catalog.history.revision.current' | 'catalog.history.revisions.showLess' | 'catalog.history.revisions.showMore' | 'navigationTabs.label' | 'sidebar.menu.backLabel' | 'sidebar.menu.backToLabel' | 'sidebar.actions.show' | 'sidebar.actions.hide' | 'sidebar.actions.changeToSingleColumn' | 'sidebar.actions.changeToTwoColumns' | 'sidebar.actions.singleColumn' | 'sidebar.actions.twoColumns' | 'versionPicker.label' | 'versionPicker.unversioned' | 'codeSnippet.copy.buttonText' | 'codeSnippet.copy.tooltipText' | 'codeSnippet.copy.toasterText' | 'markdown.editPage.text' | 'feedback.settings.comment.submitText' | 'feedback.settings.comment.label' | 'feedback.settings.comment.send' | 'feedback.settings.comment.cancel' | 'feedback.settings.comment.maxLength' | 'feedback.settings.comment.satisfiedLabel' | 'feedback.settings.comment.neutralLabel' | 'feedback.settings.comment.dissatisfiedLabel' | 'feedback.settings.submitText' | 'feedback.settings.label' | 'feedback.settings.reasons.label' | 'feedback.submit' | 'feedback.cancel' | 'feedback.settings.comment.likeLabel' | 'feedback.settings.comment.dislikeLabel' | 'feedback.sentiment.thumbUp' | 'feedback.sentiment.thumbDown' | 'feedback.settings.leftScaleLabel' | 'feedback.settings.rightScaleLabel' | 'feedback.settings.optionalEmail.placeholder' | 'feedback.settings.optionalEmail.label' | 'codeSnippet.report.buttonText' | 'codeSnippet.report.tooltipText' | 'codeSnippet.report.label' | 'codeSnippet.expand.tooltipText' | 'codeSnippet.collapse.tooltipText' | 'jsonViewer.showMore' | 'jsonViewer.showLess' | 'userMenu.login' | 'userMenu.logout' | 'userMenu.devOnboardingLabel' | 'mobileMenu.mainMenu' | 'mobileMenu.previous' | 'mobileMenu.products' | 'mobileMenu.version' | 'navbar.label' | 'navbar.products' | 'page.nextButton' | 'page.previousButton' | 'page.actions.copyButtonText' | 'page.actions.copyTitle' | 'page.actions.copyDescription' | 'page.actions.viewAsMdTitle' | 'page.actions.viewAsMdButtonText' | 'page.actions.viewAsMdDescription' | 'page.actions.chatGptTitle' | 'page.actions.chatGptButtonText' | 'page.actions.chatGptDescription' | 'page.actions.claudeTitle' | 'page.actions.claudeButtonText' | 'page.actions.claudeDescription' | 'page.actions.cursorMcpButtonText' | 'page.actions.cursorMcpTitle' | 'page.actions.cursorMcpDescription' | 'page.actions.connectMcp' | 'page.actions.connectMcp.cursor' | 'page.actions.connectMcp.cursorDescription' | 'page.actions.connectMcp.vscode' | 'page.actions.connectMcp.vscodeDescription' | 'page.actions.connectMcp.claude' | 'page.actions.connectMcp.claudeDescription' | 'page.actions.connectMcp.claudeCode' | 'page.actions.connectMcp.claudeCodeDescription' | 'page.actions.connectMcp.codex' | 'page.actions.connectMcp.codexDescription' | 'page.actions.connectMcp.copyConfig' | 'page.actions.connectMcp.copyConfigDescription' | 'page.actions.connectMcp.moreOptions' | 'page.actions.moreActions' | 'promptTag.copy.buttonText' | 'promptTag.showPrompt' | 'promptTag.hidePrompt' | 'promptTag.showFullPrompt' | 'promptTag.showLess' | 'promptTag.openIn.cursor' | 'promptTag.openIn.cursorDescription' | 'promptTag.openIn.claude' | 'promptTag.openIn.claudeDescription' | 'promptTag.openIn.chatgpt' | 'promptTag.openIn.chatgptDescription' | 'openapi.download.description.title' | 'openapi.info.title' | 'openapi.info.contact.url' | 'openapi.info.contact.name' | 'openapi.info.license' | 'openapi.info.termsOfService' | 'openapi.info.metadata.title' | 'graphql.info.metadata.title' | 'openapi.key' | 'openapi.value' | 'openapi.enum' | 'openapi.items' | 'openapi.default' | 'openapi.variable' | 'openapi.variables' | 'openapi.actions.show' | 'openapi.actions.hide' | 'openapi.actions.more' | 'openapi.languages.title' | 'openapi.languages.moreButton.tooltipText' | 'openapi.servers.title' | 'openapi.operations' | 'openapi.schemas' | 'openapi.webhooks' | 'openapi.description' | 'openapi.badges.deprecated' | 'openapi.badges.required' | 'openapi.badges.webhook' | 'openapi.request' | 'openapi.path' | 'openapi.query' | 'openapi.querystring' | 'openapi.cookie' | 'openapi.header' | 'openapi.body' | 'openapi.responses' | 'openapi.response' | 'openapi.callbacks' | 'openapi.callbackRequest' | 'openapi.callbackResponse' | 'openapi.payload' | 'openapi.discriminator' | 'openapi.contentType' | 'openapi.tryIt' | 'openapi.loading' | 'openapi.example' | 'openapi.examples' | 'openapi.additionalProperties' | 'openapi.patternProperties' | 'openapi.required' | 'openapi.recursive' | 'openapi.complex' | 'openapi.property' | 'openapi.properties' | 'openapi.details' | 'openapi.hideExample' | 'openapi.showExample' | 'openapi.expandAll' | 'openapi.deepLink.tooltip' | 'openapi.collapseAll' | 'openapi.viewSecurityDetails' | 'openapi.noResponseExample' | 'openapi.discriminator.searchPlaceholder' | 'openapi.discriminator.searchNoResults' | 'openapi.discriminator.defaultMapping' | 'openapi.discriminator.defaultMappingTooltip' | 'openapi.noResponseContent' | 'openapi.noRequestPayload' | 'openapi.noRequestData' | 'openapi.hidePattern' | 'openapi.showPattern' | 'openapi.authorizationUrl' | 'openapi.tokenUrl' | 'openapi.refreshUrl' | 'openapi.showOptionalScopes' | 'openapi.hideOptionalScopes' | 'openapi.security' | 'openapi.httpAuthorizationScheme' | 'openapi.bearerFormat' | 'openapi.parameterName' | 'openapi.flowType' | 'openapi.connectUrl' | 'openapi.requiredScopes' | 'openapi.unsupportedLanguage' | 'openapi.failedToGenerateCodeSample' | 'openapi.schemaCatalogLink.title' | 'openapi.schemaCatalogLink.copyButtonTooltip' | 'openapi.schemaCatalogLink.copiedTooltip' | 'openapi.mcp.title' | 'openapi.mcp.endpoint' | 'openapi.mcp.tools' | 'openapi.mcp.protocolVersion' | 'openapi.mcp.capabilities' | 'openapi.mcp.experimentalCapabilities' | 'openapi.mcp.inputSchema' | 'openapi.mcp.inputExample' | 'openapi.mcp.outputSchema' | 'openapi.mcp.outputExample' | 'openapi.mcp.exampleTitle' | 'openapi.mcp.argumentsExample' | 'asyncapi.download.description.title' | 'asyncapi.info.title' | 'asyncapi.info.contact.url' | 'asyncapi.info.contact.name' | 'asyncapi.info.license' | 'asyncapi.info.termsOfService' | 'asyncapi.key' | 'asyncapi.value' | 'asyncapi.variables' | 'asyncapi.required' | 'asyncapi.requiredScopes' | 'asyncapi.viewSecurityDetails' | 'graphql.download.description.title' | 'graphql.info.title' | 'graphql.info.contact.url' | 'graphql.info.contact.name' | 'graphql.info.license' | 'graphql.info.termsOfService' | 'graphql.overview' | 'graphql.metadata' | 'graphql.key' | 'graphql.value' | 'graphql.queries' | 'graphql.mutations' | 'graphql.subscriptions' | 'graphql.directives' | 'graphql.objects' | 'graphql.interfaces' | 'graphql.unions' | 'graphql.enums' | 'graphql.inputs' | 'graphql.scalars' | 'graphql.actions.show' | 'graphql.actions.hide' | 'graphql.actions.more' | 'graphql.fields' | 'graphql.inputFields' | 'graphql.values' | 'graphql.arguments.label' | 'graphql.arguments.show' | 'graphql.arguments.hide' | 'graphql.arguments.here' | 'graphql.returnTypes.label' | 'graphql.returnTypes.show' | 'graphql.returnTypes.hide' | 'graphql.possibleTypes' | 'graphql.defaultValue' | 'graphql.deprecationReason' | 'graphql.requiredScopes' | 'graphql.viewSecurityDetails' | 'graphql.objectScopes' | 'graphql.fieldScopes' | 'graphql.implementedInterfaces' | 'graphql.implementedBy' | 'graphql.nonNull' | 'graphql.required' | 'asyncapi.badges.deprecated' | 'graphql.badges.deprecated' | 'asyncapi.actions.show' | 'asyncapi.actions.hide' | 'asyncapi.actions.more' | 'asyncapi.payload' | 'asyncapi.parameters' | 'asyncapi.messages' | 'asyncapi.contentType' | 'asyncapi.moreDetails' | 'asyncapi.property' | 'asyncapi.properties' | 'asyncapi.details' | 'asyncapi.reply' | 'asyncapi.servers.title' | 'graphql.variables' | 'graphql.querySample' | 'graphql.mutationSample' | 'graphql.subscriptionSample' | 'graphql.responseSample' | 'graphql.locations' | 'graphql.sample' | 'graphql.referenced' | 'graphql.content.fragment' | 'graphql.tryIt' | 'graphql.loading' | 'button.download.tooltipText' | 'button.externalLink.tooltipText' | 'button.email.tooltipText' | 'codeWalkthrough.download' | 'codeWalkthrough.preview' | 'time.justNow' | 'time.past.second' | 'time.past.seconds' | 'time.past.minute' | 'time.past.minutes' | 'time.past.hour' | 'time.past.hours' | 'time.past.day' | 'time.past.days' | 'time.past.week' | 'time.past.weeks' | 'time.past.month' | 'time.past.months' | 'time.past.year' | 'time.past.years' | 'page.internalServerError.title' | 'page.internalServerError.description' | 'page.skipToContent.label' | 'select.noResults' | 'loaders.loading' | 'filter.dateRange.from' | 'filter.dateRange.to' | 'diagram.openFullscreen' | 'diagram.zoomIn' | 'diagram.zoomOut' | 'diagram.reset' | 'diagram.close' | 'diagram.viewer' | 'consent.title' | 'consent.message' | 'consent.privacyPolicy' | 'consent.customize' | 'consent.rejectAll' | 'consent.acceptAll' | 'consent.acceptAllCookies' | 'consent.savePreferences' | 'consent.dialog.title' | 'consent.dialog.description' | 'consent.dialog.close' | 'consent.alwaysOn' | 'consent.alwaysOff' | 'consent.gpcNotice' | 'consent.category.necessary.title' | 'consent.category.necessary.description' | 'consent.category.analytics.title' | 'consent.category.analytics.description' | 'consent.category.marketing.title' | 'consent.category.marketing.description' | 'consent.settingsLink';
+export type TranslationKey = 'dev.newApp' | 'dev.newApp.text' | 'dev.sidebar.header' | 'dev.sidebar.footer.text' | 'dev.create.app.dialog.appName.placeholder' | 'dev.create.app.dialog.appName.error' | 'dev.create.app.dialog.selectAPIs' | 'dev.create.app.dialog.description' | 'dev.create.app.dialog.description.placeholder' | 'dev.create.app.dialog.create' | 'dev.create.app.dialog.cancel' | 'dev.main.tab.appKeys' | 'dev.main.tab.logs' | 'dev.app.description.title' | 'dev.edit.description.dialog.title' | 'dev.edit.description.dialog.save' | 'dev.edit.description.dialog.cancel' | 'dev.create.app.dialog.callbackUrls' | 'dev.create.app.dialog.callbackUrls.placeholder' | 'dev.create.app.dialog.callbackUrls.hint' | 'dev.app.callbackUrls.title' | 'dev.edit.callbackUrls.dialog.title' | 'dev.edit.callbackUrls.dialog.placeholder' | 'dev.edit.callbackUrls.dialog.hint' | 'dev.edit.callbackUrls.dialog.save' | 'dev.edit.callbackUrls.dialog.cancel' | 'dev.edit.apis.dialog.selectedAPIs' | 'dev.app.key.create' | 'dev.create.key.dialog.title' | 'dev.create.key.dialog.create' | 'dev.create.key.dialog.cancel' | 'dev.app.edit' | 'dev.app.delete' | 'dev.edit.app.dialog.title' | 'dev.edit.app.dialog.save' | 'dev.edit.app.dialog.cancel' | 'dev.delete.app.dialog.title' | 'dev.delete.app.dialog.confirmation' | 'dev.delete.app.dialog.delete' | 'dev.delete.app.dialog.cancel' | 'dev.app.key.roll' | 'dev.roll.key.dialog.title' | 'dev.roll.key.dialog.apiKey' | 'dev.roll.key.dialog.expires' | 'dev.roll.key.dialog.confirmation' | 'dev.roll.key.dialog.cancel' | 'dev.roll.key.dialog.roll' | 'dev.update.key.dialog.title' | 'dev.update.key.dialog.update' | 'dev.update.key.dialog.cancel' | 'dev.app.key.api.name' | 'dev.app.key.api.status' | 'dev.app.key.api.edit' | 'dev.edit.apis.dialog.title' | 'dev.edit.apis.dialog.apiKey' | 'dev.edit.apis.dialog.save' | 'dev.edit.apis.dialog.cancel' | 'dev.select.placeholder' | 'dev.app.overview.status.pending' | 'dev.app.overview.status.approved' | 'dev.app.overview.status.revoked' | 'dev.app.overview.status' | 'dev.app.overview.non-production' | 'dev.app.overview.production' | 'dev.app.overview.clientId' | 'dev.app.overview.apiKey' | 'dev.app.key.revoke' | 'dev.revoke.key.dialog.title' | 'dev.revoke.key.dialog.apiKey' | 'dev.revoke.key.dialog.expires' | 'dev.revoke.key.dialog.confirmation' | 'dev.revoke.key.dialog.revoke' | 'dev.revoke.key.dialog.cancel' | 'dev.app.overview.expires' | 'dev.app.overview.created' | 'dev.app.overview.visibilityToggle.hide' | 'dev.app.overview.visibilityToggle.show' | 'search.loading' | 'search.noResults.title' | 'search.keys.navigate' | 'search.keys.select' | 'search.keys.exit' | 'search.label' | 'search.cancel' | 'search.recent' | 'search.navbar.label' | 'search.suggested' | 'search.showMore' | 'search.error.title' | 'search.error.button' | 'search.filter.title' | 'search.filter.reset' | 'search.filter.field.reset' | 'search.ai.welcomeText' | 'search.ai.newConversation' | 'search.ai.backToSearch' | 'search.ai.back' | 'search.ai.assistant' | 'search.ai.placeholder' | 'search.ai.generatingResponse' | 'search.ai.followUpQuestion' | 'search.ai.send' | 'search.ai.suggestionsTitle' | 'search.ai.thinkingText' | 'search.ai.resourcesFound' | 'search.ai.resourcesFound.basedOn' | 'search.ai.resourcesFound.resources' | 'search.ai.feedback.title' | 'search.ai.feedback.detailsPlaceholder' | 'search.ai.feedback.thanks' | 'search.ai.toolCall.executed' | 'search.ai.toolCall.executing' | 'search.ai.toolCall.usedTools' | 'search.ai.button' | 'search.ai.label' | 'search.ai.disclaimer' | 'search.ai.error.description' | 'search.ai.error.description.forbidden' | 'search.ai.error.description.unauthorized' | 'search.ai.error.header' | 'search.ai.error.header.forbidden' | 'search.ai.error.header.unauthorized' | 'search.ai.feedback.more' | 'search.ai.actions.copy' | 'search.ai.actions.like' | 'search.ai.actions.dislike' | 'search.searchItem.deprecated' | 'search.searchItem.enum' | 'search.searchItem.example' | 'search.groups.all' | 'search.filter.field.footer' | 'aiAssistant.trigger' | 'toc.header' | 'footer.copyrightText' | 'page.homeButton' | 'page.forbidden.title' | 'page.forbidden.description' | 'page.notFound.title' | 'page.notFound.description' | 'page.apiNotFound.title' | 'page.apiNotFound.description' | 'page.apiNotFound.hint' | 'page.apiNotFound.backButton' | 'page.mcpNotAllowed.title' | 'page.mcpNotAllowed.description' | 'page.mcpNotAllowed.publicNote' | 'page.mcpNotAllowed.publicEndpointHint' | 'page.mcpNotAllowed.mainEndpointHint' | 'page.mcpNotAllowed.snippets.terminal.hint' | 'page.mcpNotAllowed.snippets.claudeCode.headline' | 'page.mcpNotAllowed.snippets.claudeDesktop.headline' | 'page.mcpNotAllowed.snippets.claudeDesktop.accountHint' | 'page.mcpNotAllowed.snippets.claudeDesktop.instruction' | 'page.mcpNotAllowed.snippets.chatgptApp.headline' | 'page.mcpNotAllowed.snippets.chatgptApp.instruction' | 'page.mcpNotAllowed.snippets.codexCli.headline' | 'page.mcpNotAllowed.snippets.prompt.headline' | 'page.mcpNotAllowed.snippets.prompt.hint' | 'page.mcpNotAllowed.snippets.json.hint' | 'page.mcpNotAllowed.tabs.claude' | 'page.mcpNotAllowed.tabs.chatgpt' | 'page.mcpNotAllowed.tabs.json' | 'page.lastUpdated.timeago' | 'page.lastUpdated.on' | 'catalog.filters.placeholder' | 'catalog.filters.title' | 'catalog.filters.add' | 'catalog.filters.clearAll' | 'catalog.filters.select.addFilter' | 'catalog.filters.select.all' | 'catalog.filters.done' | 'catalog.catalogs.all.title' | 'catalog.catalogs.all.description' | 'catalog.catalogs.all.switcherLabel' | 'catalog.catalogs.service.title' | 'catalog.catalogs.service.description' | 'catalog.catalogs.service.switcherLabel' | 'catalog.catalogs.user.title' | 'catalog.catalogs.user.description' | 'catalog.catalogs.user.switcherLabel' | 'catalog.catalogs.team.title' | 'catalog.catalogs.team.description' | 'catalog.catalogs.team.switcherLabel' | 'catalog.catalogs.domain.title' | 'catalog.catalogs.domain.description' | 'catalog.catalogs.domain.switcherLabel' | 'catalog.catalogs.apiDescription.title' | 'catalog.catalogs.apiDescription.description' | 'catalog.catalogs.apiDescription.switcherLabel' | 'catalog.catalogs.dataSchema.title' | 'catalog.catalogs.dataSchema.description' | 'catalog.catalogs.dataSchema.switcherLabel' | 'catalog.catalogs.apiOperation.title' | 'catalog.catalogs.apiOperation.description' | 'catalog.catalogs.apiOperation.switcherLabel' | 'catalog.entity.metadata.title' | 'catalog.entity.schema.title' | 'catalog.entity.properties.apiDescription.title' | 'catalog.backToAllLabel' | 'catalog.notConnected' | 'catalog.tags.label' | 'catalog.sort' | 'catalog.catalogs.label' | 'catalog.owners.label' | 'catalog.repositories.label' | 'catalog.email.label' | 'catalog.format.label' | 'catalog.entityType.label' | 'catalog.domains.label' | 'catalog.contact.label' | 'catalog.methodAndPath.label' | 'catalog.links.label' | 'catalog.metadata.domains' | 'catalog.metadata.owners' | 'catalog.history.button.label' | 'catalog.history.sidebar.title' | 'catalog.history.sidebar.close' | 'catalog.history.version.label' | 'catalog.filters.close' | 'catalog.history.version.notSpecified' | 'catalog.history.version.default' | 'catalog.history.revisions.limitMessage' | 'catalog.history.revision.current' | 'catalog.history.revisions.showLess' | 'catalog.history.revisions.showMore' | 'navigationTabs.label' | 'sidebar.menu.backLabel' | 'sidebar.menu.backToLabel' | 'sidebar.actions.show' | 'sidebar.actions.hide' | 'sidebar.actions.changeToSingleColumn' | 'sidebar.actions.changeToTwoColumns' | 'sidebar.actions.singleColumn' | 'sidebar.actions.twoColumns' | 'versionPicker.label' | 'versionPicker.unversioned' | 'codeSnippet.copy.buttonText' | 'codeSnippet.copy.tooltipText' | 'codeSnippet.copy.toasterText' | 'markdown.editPage.text' | 'feedback.settings.comment.submitText' | 'feedback.settings.comment.label' | 'feedback.settings.comment.send' | 'feedback.settings.comment.cancel' | 'feedback.settings.comment.maxLength' | 'feedback.settings.comment.satisfiedLabel' | 'feedback.settings.comment.neutralLabel' | 'feedback.settings.comment.dissatisfiedLabel' | 'feedback.settings.submitText' | 'feedback.settings.label' | 'feedback.settings.reasons.label' | 'feedback.submit' | 'feedback.cancel' | 'feedback.settings.comment.likeLabel' | 'feedback.settings.comment.dislikeLabel' | 'feedback.sentiment.thumbUp' | 'feedback.sentiment.thumbDown' | 'feedback.settings.leftScaleLabel' | 'feedback.settings.rightScaleLabel' | 'feedback.settings.optionalEmail.placeholder' | 'feedback.settings.optionalEmail.label' | 'codeSnippet.report.buttonText' | 'codeSnippet.report.tooltipText' | 'codeSnippet.report.label' | 'codeSnippet.expand.tooltipText' | 'codeSnippet.collapse.tooltipText' | 'jsonViewer.showMore' | 'jsonViewer.showLess' | 'userMenu.login' | 'userMenu.logout' | 'userMenu.devOnboardingLabel' | 'mobileMenu.mainMenu' | 'mobileMenu.previous' | 'mobileMenu.products' | 'mobileMenu.version' | 'navbar.label' | 'navbar.products' | 'page.nextButton' | 'page.previousButton' | 'page.actions.copyButtonText' | 'page.actions.copyTitle' | 'page.actions.copyDescription' | 'page.actions.viewAsMdTitle' | 'page.actions.viewAsMdButtonText' | 'page.actions.viewAsMdDescription' | 'page.actions.chatGptTitle' | 'page.actions.chatGptButtonText' | 'page.actions.chatGptDescription' | 'page.actions.claudeTitle' | 'page.actions.claudeButtonText' | 'page.actions.claudeDescription' | 'page.actions.grokTitle' | 'page.actions.grokButtonText' | 'page.actions.grokDescription' | 'page.actions.cursorMcpButtonText' | 'page.actions.cursorMcpTitle' | 'page.actions.cursorMcpDescription' | 'page.actions.connectMcp' | 'page.actions.connectMcp.cursor' | 'page.actions.connectMcp.cursorDescription' | 'page.actions.connectMcp.vscode' | 'page.actions.connectMcp.vscodeDescription' | 'page.actions.connectMcp.claude' | 'page.actions.connectMcp.claudeDescription' | 'page.actions.connectMcp.claudeCode' | 'page.actions.connectMcp.claudeCodeDescription' | 'page.actions.connectMcp.codex' | 'page.actions.connectMcp.codexDescription' | 'page.actions.connectMcp.copyConfig' | 'page.actions.connectMcp.copyConfigDescription' | 'page.actions.connectMcp.moreOptions' | 'page.actions.moreActions' | 'promptTag.copy.buttonText' | 'promptTag.showPrompt' | 'promptTag.hidePrompt' | 'promptTag.showFullPrompt' | 'promptTag.showLess' | 'promptTag.openIn.cursor' | 'promptTag.openIn.cursorDescription' | 'promptTag.openIn.claude' | 'promptTag.openIn.claudeDescription' | 'promptTag.openIn.chatgpt' | 'promptTag.openIn.chatgptDescription' | 'openapi.download.description.title' | 'openapi.info.title' | 'openapi.info.contact.url' | 'openapi.info.contact.name' | 'openapi.info.license' | 'openapi.info.termsOfService' | 'openapi.info.metadata.title' | 'graphql.info.metadata.title' | 'openapi.key' | 'openapi.value' | 'openapi.enum' | 'openapi.items' | 'openapi.default' | 'openapi.variable' | 'openapi.variables' | 'openapi.actions.show' | 'openapi.actions.hide' | 'openapi.actions.more' | 'openapi.languages.title' | 'openapi.languages.moreButton.tooltipText' | 'openapi.servers.title' | 'openapi.operations' | 'openapi.schemas' | 'openapi.webhooks' | 'openapi.description' | 'openapi.badges.deprecated' | 'openapi.badges.required' | 'openapi.badges.webhook' | 'openapi.request' | 'openapi.path' | 'openapi.query' | 'openapi.querystring' | 'openapi.cookie' | 'openapi.header' | 'openapi.body' | 'openapi.responses' | 'openapi.response' | 'openapi.callbacks' | 'openapi.callbackRequest' | 'openapi.callbackResponse' | 'openapi.payload' | 'openapi.discriminator' | 'openapi.contentType' | 'openapi.tryIt' | 'openapi.loading' | 'openapi.example' | 'openapi.examples' | 'openapi.additionalProperties' | 'openapi.patternProperties' | 'openapi.required' | 'openapi.recursive' | 'openapi.complex' | 'openapi.property' | 'openapi.properties' | 'openapi.details' | 'openapi.hideExample' | 'openapi.showExample' | 'openapi.expandAll' | 'openapi.deepLink.tooltip' | 'openapi.collapseAll' | 'openapi.viewSecurityDetails' | 'openapi.noResponseExample' | 'openapi.discriminator.searchPlaceholder' | 'openapi.discriminator.searchNoResults' | 'openapi.discriminator.defaultMapping' | 'openapi.discriminator.defaultMappingTooltip' | 'openapi.noResponseContent' | 'openapi.noRequestPayload' | 'openapi.noRequestData' | 'openapi.hidePattern' | 'openapi.showPattern' | 'openapi.authorizationUrl' | 'openapi.tokenUrl' | 'openapi.refreshUrl' | 'openapi.showOptionalScopes' | 'openapi.hideOptionalScopes' | 'openapi.security' | 'openapi.httpAuthorizationScheme' | 'openapi.bearerFormat' | 'openapi.parameterName' | 'openapi.flowType' | 'openapi.connectUrl' | 'openapi.requiredScopes' | 'openapi.unsupportedLanguage' | 'openapi.failedToGenerateCodeSample' | 'openapi.schemaCatalogLink.title' | 'openapi.schemaCatalogLink.copyButtonTooltip' | 'openapi.schemaCatalogLink.copiedTooltip' | 'openapi.mcp.title' | 'openapi.mcp.endpoint' | 'openapi.mcp.tools' | 'openapi.mcp.protocolVersion' | 'openapi.mcp.capabilities' | 'openapi.mcp.experimentalCapabilities' | 'openapi.mcp.inputSchema' | 'openapi.mcp.inputExample' | 'openapi.mcp.outputSchema' | 'openapi.mcp.outputExample' | 'openapi.mcp.exampleTitle' | 'openapi.mcp.argumentsExample' | 'asyncapi.download.description.title' | 'asyncapi.info.title' | 'asyncapi.info.contact.url' | 'asyncapi.info.contact.name' | 'asyncapi.info.license' | 'asyncapi.info.termsOfService' | 'asyncapi.key' | 'asyncapi.value' | 'asyncapi.variables' | 'asyncapi.required' | 'asyncapi.requiredScopes' | 'asyncapi.viewSecurityDetails' | 'graphql.download.description.title' | 'graphql.info.title' | 'graphql.info.contact.url' | 'graphql.info.contact.name' | 'graphql.info.license' | 'graphql.info.termsOfService' | 'graphql.overview' | 'graphql.metadata' | 'graphql.key' | 'graphql.value' | 'graphql.queries' | 'graphql.mutations' | 'graphql.subscriptions' | 'graphql.directives' | 'graphql.objects' | 'graphql.interfaces' | 'graphql.unions' | 'graphql.enums' | 'graphql.inputs' | 'graphql.scalars' | 'graphql.actions.show' | 'graphql.actions.hide' | 'graphql.actions.more' | 'graphql.fields' | 'graphql.inputFields' | 'graphql.values' | 'graphql.arguments.label' | 'graphql.arguments.show' | 'graphql.arguments.hide' | 'graphql.arguments.here' | 'graphql.returnTypes.label' | 'graphql.returnTypes.show' | 'graphql.returnTypes.hide' | 'graphql.possibleTypes' | 'graphql.defaultValue' | 'graphql.deprecationReason' | 'graphql.requiredScopes' | 'graphql.viewSecurityDetails' | 'graphql.objectScopes' | 'graphql.fieldScopes' | 'graphql.implementedInterfaces' | 'graphql.implementedBy' | 'graphql.nonNull' | 'graphql.required' | 'asyncapi.badges.deprecated' | 'graphql.badges.deprecated' | 'asyncapi.actions.show' | 'asyncapi.actions.hide' | 'asyncapi.actions.more' | 'asyncapi.payload' | 'asyncapi.parameters' | 'asyncapi.messages' | 'asyncapi.contentType' | 'asyncapi.moreDetails' | 'asyncapi.property' | 'asyncapi.properties' | 'asyncapi.details' | 'asyncapi.reply' | 'asyncapi.servers.title' | 'graphql.variables' | 'graphql.querySample' | 'graphql.mutationSample' | 'graphql.subscriptionSample' | 'graphql.responseSample' | 'graphql.locations' | 'graphql.sample' | 'graphql.referenced' | 'graphql.content.fragment' | 'graphql.tryIt' | 'graphql.loading' | 'button.download.tooltipText' | 'button.externalLink.tooltipText' | 'button.email.tooltipText' | 'codeWalkthrough.download' | 'codeWalkthrough.preview' | 'time.justNow' | 'time.past.second' | 'time.past.seconds' | 'time.past.minute' | 'time.past.minutes' | 'time.past.hour' | 'time.past.hours' | 'time.past.day' | 'time.past.days' | 'time.past.week' | 'time.past.weeks' | 'time.past.month' | 'time.past.months' | 'time.past.year' | 'time.past.years' | 'page.internalServerError.title' | 'page.internalServerError.description' | 'page.skipToContent.label' | 'select.noResults' | 'loaders.loading' | 'filter.dateRange.from' | 'filter.dateRange.to' | 'diagram.openFullscreen' | 'diagram.zoomIn' | 'diagram.zoomOut' | 'diagram.reset' | 'diagram.close' | 'diagram.viewer' | 'consent.title' | 'consent.message' | 'consent.privacyPolicy' | 'consent.customize' | 'consent.rejectAll' | 'consent.acceptAll' | 'consent.acceptAllCookies' | 'consent.savePreferences' | 'consent.dialog.title' | 'consent.dialog.description' | 'consent.dialog.close' | 'consent.alwaysOn' | 'consent.alwaysOff' | 'consent.gpcNotice' | 'consent.category.necessary.title' | 'consent.category.necessary.description' | 'consent.category.analytics.title' | 'consent.category.analytics.description' | 'consent.category.marketing.title' | 'consent.category.marketing.description' | 'consent.settingsLink';
 export type Locale = {
     code: string;
     name: string;

package/lib/core/utils/get-ai-prompt-link.d.ts

@@ -1,4 +1,5 @@
 import type { AiPromptTarget } from '../types/prompt';
+type AiPromptLinkTarget = AiPromptTarget | 'grok';
 /**
  * Builds a link that opens an AI tool with the prompt prefilled.
  *
@@ -12,4 +13,5 @@ import type { AiPromptTarget } from '../types/prompt';
  * // 'https://claude.ai/new?q=Summarize+this+page'
  * ```
  */
-export declare function getAiPromptLink(target: AiPromptTarget, prompt: string): string;
+export declare function getAiPromptLink(target: AiPromptLinkTarget, prompt: string): string;
+export {};

package/lib/core/utils/get-ai-prompt-link.js

@@ -4,6 +4,7 @@ exports.getAiPromptLink = getAiPromptLink;
 const AI_PROMPT_ENDPOINTS = {
     chatgpt: { baseUrl: 'https://chat.openai.com', queryParam: 'q' },
     claude: { baseUrl: 'https://claude.ai/new', queryParam: 'q' },
+    grok: { baseUrl: 'https://grok.com/', queryParam: 'q' },
     // Encoding: https://cursor.com/docs/integrations/deeplinks
     cursor: { baseUrl: 'https://cursor.com/link/prompt', queryParam: 'text' },
 };

package/lib/icons/GrokIcon/GrokIcon.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import type { IconProps } from '../../icons/types';
+declare const Icon: (props: IconProps) => React.JSX.Element;
+export declare const GrokIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<{
+    color?: string;
+    size?: string;
+    className?: string;
+    'data-component-name'?: string;
+} & React.SVGProps<SVGSVGElement>, "data-component-name" | "size" | keyof React.SVGProps<SVGSVGElement>> & {
+    color?: string;
+    size?: string;
+    className?: string;
+    'data-component-name'?: string;
+} & React.SVGProps<SVGSVGElement>, "data-component-name"> & Partial<Pick<import("styled-components").FastOmit<{
+    color?: string;
+    size?: string;
+    className?: string;
+    'data-component-name'?: string;
+} & React.SVGProps<SVGSVGElement>, "data-component-name" | "size" | keyof React.SVGProps<SVGSVGElement>> & {
+    color?: string;
+    size?: string;
+    className?: string;
+    'data-component-name'?: string;
+} & React.SVGProps<SVGSVGElement>, "data-component-name">>> & string & Omit<typeof Icon, keyof React.Component<any, {}, any>>;
+export {};

package/lib/icons/GrokIcon/GrokIcon.js

@@ -0,0 +1,23 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GrokIcon = void 0;
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const utils_1 = require("../../core/utils");
+const Icon = (props) => (react_1.default.createElement("svg", Object.assign({ viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props),
+    react_1.default.createElement("path", { d: "M6.6345 9.6347L10.6239 6.6862C10.8195 6.5417 11.0991 6.598 11.1923 6.8226C11.6827 8.0067 11.4636 9.4297 10.4877 10.4067C9.5119 11.3837 8.1541 11.5979 6.9131 11.1099L5.5573 11.7384C7.5019 13.0691 9.8631 12.74 11.3387 11.2617C12.5091 10.0899 12.8716 8.4926 12.5327 7.0522L12.5357 7.0553C12.0442 4.9393 12.6566 4.0935 13.9109 2.364C13.9406 2.3229 13.9703 2.2819 14 2.2399L12.3493 3.8925V3.8874L6.6335 9.6357" }),
+    react_1.default.createElement("path", { d: "M5.8113 10.3513C4.4156 9.0165 4.6562 6.9507 5.8471 5.7594C6.7277 4.8777 8.1705 4.5179 9.43 5.0469L10.7827 4.4215C10.539 4.2452 10.2266 4.0555 9.8682 3.9223C8.2483 3.2549 6.3089 3.587 4.9921 4.9044C3.7254 6.1726 3.3271 8.1225 4.0111 9.7864C4.5221 11.03 3.6844 11.9096 2.8407 12.7974C2.5417 13.1122 2.2417 13.4269 2 13.7601L5.8102 10.3523" })));
+exports.GrokIcon = (0, styled_components_1.default)(Icon).attrs({
+    'data-component-name': 'icons/GrokIcon/GrokIcon',
+}) `
+  path {
+    fill: ${({ color }) => (0, utils_1.getCssColorVariable)(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;
+//# sourceMappingURL=GrokIcon.js.map

package/lib/index.d.ts

@@ -165,6 +165,7 @@ export * from './icons/SpinnerIcon/SpinnerIcon';
 export * from './icons/ChatGptIcon/ChatGptIcon';
 export * from './icons/CopyIcon/CopyIcon';
 export * from './icons/ClaudeIcon/ClaudeIcon';
+export * from './icons/GrokIcon/GrokIcon';
 export * from './icons/CleanIcon/CleanIcon';
 export * from './icons/GraphqlIcon/GraphqlIcon';
 export * from './icons/DeselectIcon/DeselectIcon';

package/lib/index.js

@@ -229,6 +229,7 @@ __exportStar(require("./icons/SpinnerIcon/SpinnerIcon"), exports);
 __exportStar(require("./icons/ChatGptIcon/ChatGptIcon"), exports);
 __exportStar(require("./icons/CopyIcon/CopyIcon"), exports);
 __exportStar(require("./icons/ClaudeIcon/ClaudeIcon"), exports);
+__exportStar(require("./icons/GrokIcon/GrokIcon"), exports);
 __exportStar(require("./icons/CleanIcon/CleanIcon"), exports);
 __exportStar(require("./icons/GraphqlIcon/GraphqlIcon"), exports);
 __exportStar(require("./icons/DeselectIcon/DeselectIcon"), exports);

package/lib/markdoc/components/NumberedList/NumberedItem.js

@@ -55,8 +55,8 @@ function NumberedItem({ headline, anchorId, headlineLevel, icon, iconRawContent,
         type === exports.NumberedListType.ICON && (react_1.default.createElement(MarkerContent, { className: "numbered-item-marker-content" },
             react_1.default.createElement(GenericIcon_1.GenericIcon, { icon: icon, rawContent: iconRawContent }))),
         type === exports.NumberedListType.NUMBER && (react_1.default.createElement(MarkerContent, { className: "numbered-item-marker-content" }, index)),
-        anchorId && (react_1.default.createElement(MarkerLink, { className: "numbered-item-marker-link", $isDot: isDot },
-            react_1.default.createElement(MarkerLinkIcon, { "aria-hidden": "true", focusable: "false", color: "--md-numbered-list-marker-text-color" })))));
+        anchorId && (react_1.default.createElement(MarkerLink, { className: "numbered-item-marker-link", "aria-hidden": "true" },
+            react_1.default.createElement(MarkerLinkIcon, { "aria-hidden": "true", focusable: "false", size: "var(--md-numbered-list-marker-link-size)", color: "--md-numbered-list-marker-link-icon-color" })))));
     return (react_1.default.createElement(NumberedItemWrapper, { "data-component-name": "Markdoc/NumberedList/NumberedItem", className: className, id: anchorId, $size: size, $isDot: isDot },
         react_1.default.createElement(MarkerRail, null,
             anchorId ? (react_1.default.createElement("a", Object.assign({ href: `#${anchorId}` }, (headline
@@ -110,24 +110,23 @@ const MarkerContent = styled_components_1.default.span `
   justify-content: center;
 `;
 const MarkerLink = styled_components_1.default.span `
+  position: absolute;
+  inset-inline-end: calc(100% + var(--md-numbered-list-marker-link-gap));
   display: none;
   align-items: center;
   justify-content: center;
 
-  svg {
-    width: var(--icon-width, 16px);
-    height: var(--icon-height, 16px);
+  &::before {
+    content: '';
+    position: absolute;
+    inset-block: 0;
+    inset-inline-start: 100%;
+    width: var(--md-numbered-list-marker-link-gap);
   }
-
-  ${({ $isDot }) => $isDot &&
-    (0, styled_components_1.css) `
-      position: absolute;
-      inset-inline-end: calc(100% + var(--md-numbered-list-dot-link-gap));
-    `}
 `;
 const MarkerLinkIcon = (0, styled_components_1.default)(LinkIcon_1.LinkIcon) `
   path:first-of-type {
-    fill: var(--md-numbered-list-marker-icon-bg-color);
+    fill: var(--md-numbered-list-marker-link-bg-color);
   }
 `;
 const MarkerRail = styled_components_1.default.span `
@@ -199,17 +198,10 @@ const NumberedItemWrapper = styled_components_1.default.li `
     padding-bottom: 0;
   }
 
-  &:hover,
-  &:focus-within {
-    ${Marker} {
-      background-color: ${({ $isDot }) => $isDot ? 'var(--text-color-primary)' : 'var(--md-numbered-list-marker-bg-color-hover)'};
-    }
-
-    a ${Marker}:not([data-dot]) .numbered-item-marker-content {
-      display: none;
-    }
-
-    a ${Marker} .numbered-item-marker-link {
+  &:has(${MarkerRail} a:hover),
+  &:has(${MarkerRail} a:focus-visible),
+  &:has(${NumberedItemHeadline}:hover) {
+    .numbered-item-marker-link {
       display: flex;
     }
   }

package/lib/markdoc/components/NumberedList/variables.js

@@ -11,8 +11,6 @@ exports.markdownNumberedList = (0, styled_components_1.css) `
   --md-numbered-list-gap: var(--spacing-base); // @presenter Spacing
 
   --md-numbered-list-marker-bg-color: var(--color-warm-grey-2); // @presenter Color
-  --md-numbered-list-marker-bg-color-hover: var(--color-warm-grey-3); // @presenter Color
-  --md-numbered-list-marker-icon-bg-color: transparent; // @presenter Color
   --md-numbered-list-marker-text-color: var(--text-color-primary); // @presenter Color
   --md-numbered-list-marker-font-size: var(--font-size-base); // @presenter FontSize
 
@@ -23,7 +21,10 @@ exports.markdownNumberedList = (0, styled_components_1.css) `
   --md-numbered-list-icon-small-size: 12px; // @presenter Spacing
   --md-numbered-list-dot-size: 10px; // @presenter Spacing
   --md-numbered-list-dot-rail-padding-top: 7px; // @presenter Spacing
-  --md-numbered-list-dot-link-gap: 6px; // @presenter Spacing
+  --md-numbered-list-marker-link-gap: 10px; // @presenter Spacing
+  --md-numbered-list-marker-link-size: 20px; // @presenter Spacing
+  --md-numbered-list-marker-link-icon-color: var(--md-numbered-list-marker-text-color); // @presenter Color
+  --md-numbered-list-marker-link-bg-color: var(--bg-color-tonal); // @presenter Color
 
   --md-numbered-list-tail-bg-color: var(--md-numbered-list-marker-bg-color); // @presenter Color
   --md-numbered-list-tail-fade-gradient: linear-gradient(to bottom, var(--md-numbered-list-tail-bg-color), transparent); // @presenter Color

package/lib/markdoc/default.d.ts

@@ -30,6 +30,7 @@ import { icon } from '../markdoc/tags/icon';
 import { connectMcp } from '../markdoc/tags/connect-mcp';
 import { loginButton } from '../markdoc/tags/login-button';
 import { diagram } from '../markdoc/tags/diagram';
+import { visibility } from '../markdoc/tags/visibility';
 import { prompt } from '../markdoc/tags/prompt';
 export declare const tags: {
     [accordion.tagName]: import("./tags/types").MarkdocTagSchema;
@@ -57,5 +58,6 @@ export declare const tags: {
     [connectMcp.tagName]: import("./tags/types").MarkdocTagSchema;
     [loginButton.tagName]: import("./tags/types").MarkdocTagSchema;
     [diagram.tagName]: import("./tags/types").MarkdocTagSchema;
+    [visibility.tagName]: import("./tags/types").MarkdocTagSchema;
     [prompt.tagName]: import("./tags/types").MarkdocTagSchema;
 };

package/lib/markdoc/default.js

@@ -72,6 +72,7 @@ const icon_1 = require("../markdoc/tags/icon");
 const connect_mcp_1 = require("../markdoc/tags/connect-mcp");
 const login_button_1 = require("../markdoc/tags/login-button");
 const diagram_1 = require("../markdoc/tags/diagram");
+const visibility_1 = require("../markdoc/tags/visibility");
 const prompt_1 = require("../markdoc/tags/prompt");
 exports.tags = {
     [accordion_1.accordion.tagName]: accordion_1.accordion.schema,
@@ -99,6 +100,7 @@ exports.tags = {
     [connect_mcp_1.connectMcp.tagName]: connect_mcp_1.connectMcp.schema,
     [login_button_1.loginButton.tagName]: login_button_1.loginButton.schema,
     [diagram_1.diagram.tagName]: diagram_1.diagram.schema,
+    [visibility_1.visibility.tagName]: visibility_1.visibility.schema,
     [prompt_1.prompt.tagName]: prompt_1.prompt.schema,
 };
 //# sourceMappingURL=default.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redocly/theme",
-  "version": "0.71.0-next.3",
+  "version": "0.71.0-next.5",
   "description": "Shared UI components lib",
   "keywords": [
     "theme",
@@ -43,7 +43,7 @@
   "devDependencies": {
     "@babel/core": "7.29.7",
     "@markdoc/markdoc": "0.5.2",
-    "@redocly/realm-asyncapi-sdk": "0.16.0",
+    "@redocly/realm-asyncapi-sdk": "0.17.0-next.0",
     "@redocly/tooling-test-utils": "0.0.0",
     "@shikijs/types": "3.21.0",
     "@testing-library/react": "16.3.0",
@@ -58,6 +58,7 @@
     "@vitest/coverage-v8": "4.1.11",
     "@vitest/ui": "4.1.11",
     "concurrently": "7.6.0",
+    "jest-styled-components": "7.4.0",
     "react-router": "^8.3.0",
     "resize-observer-polyfill": "1.5.1",
     "rimraf": "5.0.7",

package/src/components/Buttons/MobileMenuButton.tsx

@@ -0,0 +1,45 @@
+import React, { useTransition } from 'react';
+import styled from 'styled-components';
+
+import type { JSX } from 'react';
+
+import { breakpoints } from '@redocly/theme/core/utils';
+import { Button } from '@redocly/theme/components/Button/Button';
+import { MenuIcon } from '@redocly/theme/icons/MenuIcon/MenuIcon';
+import { CloseIcon } from '@redocly/theme/icons/CloseIcon/CloseIcon';
+
+export type MobileMenuButtonProps = {
+  isOpen: boolean;
+  /** Called inside a transition; the button shows the requested state until it commits. */
+  onOpenChange: (isOpen: boolean) => void;
+  className?: string;
+};
+
+export function MobileMenuButton({
+  isOpen,
+  onOpenChange,
+  className,
+}: MobileMenuButtonProps): JSX.Element {
+  const [isToggling, startToggle] = useTransition();
+  const showClose = isToggling ? !isOpen : isOpen;
+
+  return (
+    <MobileMenuButtonWrapper
+      data-component-name="Buttons/MobileMenuButton"
+      className={className}
+      variant="text"
+      data-testid="mobile-menu-button"
+      onClick={() => startToggle(() => onOpenChange(!showClose))}
+      icon={showClose ? <CloseIcon /> : <MenuIcon />}
+      aria-label={showClose ? 'Close menu button' : 'Open menu button'}
+    />
+  );
+}
+
+const MobileMenuButtonWrapper = styled(Button)`
+  margin-left: 0px !important;
+
+  @media screen and (min-width: ${breakpoints.medium}) {
+    display: none;
+  }
+`;

package/src/components/Catalog/CatalogFilter/CatalogFilter.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import styled from 'styled-components';
 
 import type { JSX } from 'react';
-import type { FilterProps, FilterTypes } from '@redocly/theme/core/types';
+import type { FilterProps } from '@redocly/theme/core/types';
 
 import { CatalogFilterSelect } from '@redocly/theme/components/Catalog/CatalogFilter/CatalogFilterSelect';
 import { CatalogFilterCheckboxes } from '@redocly/theme/components/Catalog/CatalogFilter/CatalogFilterCheckboxes';
@@ -31,7 +31,7 @@ export function CatalogFilter({
     return null;
   }
 
-  const FilterComponent = filterComponents[(filter.type || 'checkboxes') as FilterTypes];
+  const FilterComponent = filterComponents[filter.type || 'checkboxes'];
 
   return (
     <CatalogFilterGroup

package/src/components/Feedback/Feedback.tsx

@@ -43,9 +43,7 @@ export function Feedback(props: FeedbackProps & { path?: string }) {
   const renderFeedbackComponent = () => {
     const { type, settings, path } = feedbackConf;
 
-    const FeedbackComponent = feedbackComponents[
-      type as FeedbackComponentsKeys
-    ] as FeedbackComponents[FeedbackComponentsKeys];
+    const FeedbackComponent = feedbackComponents[type as FeedbackComponentsKeys];
 
     if (!FeedbackComponent) {
       return null;

package/src/components/Navbar/Navbar.tsx

@@ -19,9 +19,7 @@ import { Search } from '@redocly/theme/components/Search/Search';
 import { UserMenu } from '@redocly/theme/components/UserMenu/UserMenu';
 import { LanguagePicker } from '@redocly/theme/components/LanguagePicker/LanguagePicker';
 import { ProductPicker } from '@redocly/theme/components/Product/ProductPicker';
-import { Button } from '@redocly/theme/components/Button/Button';
-import { MenuIcon } from '@redocly/theme/icons/MenuIcon/MenuIcon';
-import { CloseIcon } from '@redocly/theme/icons/CloseIcon/CloseIcon';
+import { MobileMenuButton } from '@redocly/theme/components/Buttons/MobileMenuButton';
 import { Banner } from '@redocly/theme/components/Banner/Banner';
 
 export type NavbarProps = {
@@ -69,25 +67,20 @@ export function Navbar({ className }: NavbarProps): JSX.Element | null {
         <LanguagePicker onChangeLanguage={changeLanguage} onlyIcon alignment="end" />
         <ColorModeSwitcher />
         <MobileMenuButton
-          variant="text"
-          data-testid="mobile-menu-button"
-          onClick={
-            isOpen
-              ? () => {
-                  closeMobileMenu();
-                  telemetry.sendMobileMenuClosedMessage([
-                    getBaseDataAttributes('mobileMenuClose', 'button'),
-                  ]);
-                }
-              : () => {
-                  openMobileMenu();
-                  telemetry.sendMobileMenuOpenedMessage([
-                    getBaseDataAttributes('mobileMenuOpen', 'button'),
-                  ]);
-                }
-          }
-          icon={isOpen ? <CloseIcon /> : <MenuIcon />}
-          aria-label={isOpen ? 'Close menu button' : 'Open menu button'}
+          isOpen={isOpen}
+          onOpenChange={(open) => {
+            if (open) {
+              openMobileMenu();
+              telemetry.sendMobileMenuOpenedMessage([
+                getBaseDataAttributes('mobileMenuOpen', 'button'),
+              ]);
+            } else {
+              closeMobileMenu();
+              telemetry.sendMobileMenuClosedMessage([
+                getBaseDataAttributes('mobileMenuClose', 'button'),
+              ]);
+            }
+          }}
         />
         {hideUserMenu ? null : <UserMenu />}
       </NavbarRow>
@@ -147,11 +140,3 @@ const NavbarRow = styled.div`
     margin-right: auto;
   }
 `;
-
-const MobileMenuButton = styled(Button)`
-  margin-left: 0px !important;
-
-  @media screen and (min-width: ${breakpoints.medium}) {
-    display: none;
-  }
-`;

package/src/core/hooks/use-focus-trap.ts

@@ -2,19 +2,22 @@ import { useEffect } from 'react';
 
 import type { RefObject } from 'react';
 
+const FOCUSABLE_SELECTOR =
+  'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])';
+
 export function useFocusTrap(containerRef: RefObject<HTMLElement | null>): void {
   useEffect(() => {
     const trapElement = containerRef.current;
 
     if (!trapElement) return;
 
-    const focusableElements = trapElement.querySelectorAll<HTMLElement>(
-      'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])',
-    );
-    const firstElement = focusableElements[0];
+    const getFocusableElements = () =>
+      trapElement.querySelectorAll<HTMLElement>(FOCUSABLE_SELECTOR);
 
     const handleKeyDown = (event: KeyboardEvent) => {
       if (event.key === 'Tab') {
+        const focusableElements = getFocusableElements();
+        const firstElement = focusableElements[0];
         const lastElement = focusableElements[focusableElements.length - 1];
         if (event.shiftKey && document.activeElement === firstElement) {
           lastElement?.focus();
@@ -28,9 +31,7 @@ export function useFocusTrap(containerRef: RefObject<HTMLElement | null>): void
 
     trapElement.addEventListener('keydown', handleKeyDown);
 
-    if (firstElement) {
-      firstElement.focus();
-    }
+    getFocusableElements()[0]?.focus();
 
     return () => {
       trapElement.removeEventListener('keydown', handleKeyDown);

package/src/core/hooks/use-page-actions.ts

@@ -1,4 +1,5 @@
 import { useMemo, useCallback } from 'react';
+import type { ComponentType } from 'react';
 
 import type { PageProps, UiAccessibleConfig } from '@redocly/config';
 import type { PageAction, MCPClientType, McpConnectionParams } from '../types';
@@ -6,6 +7,7 @@ import type { PageAction, MCPClientType, McpConnectionParams } from '../types';
 import { CopyIcon } from '@redocly/theme/icons/CopyIcon/CopyIcon';
 import { ChatGptIcon } from '@redocly/theme/icons/ChatGptIcon/ChatGptIcon';
 import { ClaudeIcon } from '@redocly/theme/icons/ClaudeIcon/ClaudeIcon';
+import { GrokIcon } from '@redocly/theme/icons/GrokIcon/GrokIcon';
 import { MarkdownFullIcon } from '@redocly/theme/icons/MarkdownFullIcon/MarkdownFullIcon';
 import { VSCodeIcon } from '@redocly/theme/icons/VSCodeIcon/VSCodeIcon';
 import { CursorIcon } from '@redocly/theme/icons/CursorIcon/CursorIcon';
@@ -30,6 +32,7 @@ const DEFAULT_ENABLED_ACTIONS = [
   'view',
   'chatgpt',
   'claude',
+  'grok',
   'docs-mcp-cursor',
   'docs-mcp-vscode',
   'docs-mcp-claude',
@@ -40,6 +43,7 @@ export type PageActionType =
   | 'view'
   | 'chatgpt'
   | 'claude'
+  | 'grok'
   | 'docs-mcp-cursor'
   | 'docs-mcp-vscode'
   | 'docs-mcp-claude'
@@ -115,6 +119,30 @@ export function usePageActions(
       : combineUrls(origin, removeTrailingSlash(pathname) + '.md');
     const externalAiPrompt = `Read ${mdPageUrl} and answer questions based on the content.`;
 
+    const createAiPromptAction =
+      (
+        target: 'chatgpt' | 'claude' | 'grok',
+        iconComponent: ComponentType,
+        texts: Pick<PageAction, 'buttonText' | 'title' | 'description'>,
+      ) =>
+      (): PageAction => {
+        const link = getAiPromptLink(target, externalAiPrompt);
+        return {
+          ...texts,
+          iconComponent,
+          link,
+          onClick: () => {
+            telemetry.sendPageActionsClickedMessage([
+              {
+                ...getBaseDataAttributes('pageActions', 'button'),
+                actionType: target,
+              },
+            ]);
+            window.location.href = link;
+          },
+        };
+      };
+
     const actionHandlers: Record<PageActionType, () => PageAction> = {
       'docs-mcp-cursor': createMCPHandler('cursor', false),
       'docs-mcp-vscode': createMCPHandler('vscode', false),
@@ -163,45 +191,23 @@ export function usePageActions(
         },
       }),
 
-      chatgpt: () => {
-        const link = getAiPromptLink('chatgpt', externalAiPrompt);
-        return {
-          buttonText: translate('page.actions.chatGptButtonText', 'Open in ChatGPT'),
-          title: translate('page.actions.chatGptTitle', 'Open in ChatGPT'),
-          description: translate('page.actions.chatGptDescription', 'Get insights from ChatGPT'),
-          iconComponent: ChatGptIcon,
-          link,
-          onClick: () => {
-            telemetry.sendPageActionsClickedMessage([
-              {
-                ...getBaseDataAttributes('pageActions', 'button'),
-                actionType: 'chatgpt',
-              },
-            ]);
-            window.location.href = link;
-          },
-        };
-      },
+      chatgpt: createAiPromptAction('chatgpt', ChatGptIcon, {
+        buttonText: translate('page.actions.chatGptButtonText', 'Open in ChatGPT'),
+        title: translate('page.actions.chatGptTitle', 'Open in ChatGPT'),
+        description: translate('page.actions.chatGptDescription', 'Get insights from ChatGPT'),
+      }),
 
-      claude: () => {
-        const link = getAiPromptLink('claude', externalAiPrompt);
-        return {
-          buttonText: translate('page.actions.claudeButtonText', 'Open in Claude'),
-          title: translate('page.actions.claudeTitle', 'Open in Claude'),
-          description: translate('page.actions.claudeDescription', 'Get insights from Claude'),
-          iconComponent: ClaudeIcon,
-          link,
-          onClick: () => {
-            telemetry.sendPageActionsClickedMessage([
-              {
-                ...getBaseDataAttributes('pageActions', 'button'),
-                actionType: 'claude',
-              },
-            ]);
-            window.location.href = link;
-          },
-        };
-      },
+      claude: createAiPromptAction('claude', ClaudeIcon, {
+        buttonText: translate('page.actions.claudeButtonText', 'Open in Claude'),
+        title: translate('page.actions.claudeTitle', 'Open in Claude'),
+        description: translate('page.actions.claudeDescription', 'Get insights from Claude'),
+      }),
+
+      grok: createAiPromptAction('grok', GrokIcon, {
+        buttonText: translate('page.actions.grokButtonText', 'Open in Grok'),
+        title: translate('page.actions.grokTitle', 'Open in Grok'),
+        description: translate('page.actions.grokDescription', 'Get insights from Grok'),
+      }),
     };
 
     return (themeConfig.navigation?.actions?.items || actions || DEFAULT_ENABLED_ACTIONS)
@@ -311,7 +317,7 @@ function shouldHideAction(
     return true;
   }
 
-  const actionDependsOnLlmsTxt = ['view', 'copy', 'chatgpt', 'claude'].includes(action);
+  const actionDependsOnLlmsTxt = ['view', 'copy', 'chatgpt', 'claude', 'grok'].includes(action);
 
   if (actionDependsOnLlmsTxt) {
     // Can't use any actions if search is globally disabled (markdown files are not generated)
@@ -345,6 +351,7 @@ function shouldHideActionByType(
   switch (action) {
     case 'chatgpt':
     case 'claude':
+    case 'grok':
       return !isPublic;
     case 'docs-mcp-cursor':
     case 'docs-mcp-vscode':

package/src/core/styles/dark.ts

@@ -67,7 +67,6 @@ const numberedListDarkMode = css`
     */
 
   --md-numbered-list-marker-bg-color: var(--color-warm-grey-3); // @presenter Color
-  --md-numbered-list-marker-bg-color-hover: var(--color-warm-grey-4); // @presenter Color
 
   // @tokens End
 `

package/src/core/types/l10n.ts

@@ -292,6 +292,9 @@ export type TranslationKey =
   | 'page.actions.claudeTitle'
   | 'page.actions.claudeButtonText'
   | 'page.actions.claudeDescription'
+  | 'page.actions.grokTitle'
+  | 'page.actions.grokButtonText'
+  | 'page.actions.grokDescription'
   | 'page.actions.cursorMcpButtonText'
   | 'page.actions.cursorMcpTitle'
   | 'page.actions.cursorMcpDescription'

package/src/core/utils/get-ai-prompt-link.ts

@@ -2,9 +2,12 @@ import type { AiPromptTarget } from '../types/prompt';
 
 type AiPromptEndpoint = { baseUrl: string; queryParam: string };
 
-const AI_PROMPT_ENDPOINTS: Record<AiPromptTarget, AiPromptEndpoint> = {
+type AiPromptLinkTarget = AiPromptTarget | 'grok';
+
+const AI_PROMPT_ENDPOINTS: Record<AiPromptLinkTarget, AiPromptEndpoint> = {
   chatgpt: { baseUrl: 'https://chat.openai.com', queryParam: 'q' },
   claude: { baseUrl: 'https://claude.ai/new', queryParam: 'q' },
+  grok: { baseUrl: 'https://grok.com/', queryParam: 'q' },
   // Encoding: https://cursor.com/docs/integrations/deeplinks
   cursor: { baseUrl: 'https://cursor.com/link/prompt', queryParam: 'text' },
 };
@@ -22,7 +25,7 @@ const AI_PROMPT_ENDPOINTS: Record<AiPromptTarget, AiPromptEndpoint> = {
  * // 'https://claude.ai/new?q=Summarize+this+page'
  * ```
  */
-export function getAiPromptLink(target: AiPromptTarget, prompt: string): string {
+export function getAiPromptLink(target: AiPromptLinkTarget, prompt: string): string {
   const { baseUrl, queryParam } = AI_PROMPT_ENDPOINTS[target];
   const url = new URL(baseUrl);
   url.searchParams.set(queryParam, prompt);

package/src/icons/GrokIcon/GrokIcon.tsx

@@ -0,0 +1,24 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+import { getCssColorVariable } from '@redocly/theme/core/utils';
+
+const Icon = (props: IconProps) => (
+  <svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+    <path d="M6.6345 9.6347L10.6239 6.6862C10.8195 6.5417 11.0991 6.598 11.1923 6.8226C11.6827 8.0067 11.4636 9.4297 10.4877 10.4067C9.5119 11.3837 8.1541 11.5979 6.9131 11.1099L5.5573 11.7384C7.5019 13.0691 9.8631 12.74 11.3387 11.2617C12.5091 10.0899 12.8716 8.4926 12.5327 7.0522L12.5357 7.0553C12.0442 4.9393 12.6566 4.0935 13.9109 2.364C13.9406 2.3229 13.9703 2.2819 14 2.2399L12.3493 3.8925V3.8874L6.6335 9.6357" />
+    <path d="M5.8113 10.3513C4.4156 9.0165 4.6562 6.9507 5.8471 5.7594C6.7277 4.8777 8.1705 4.5179 9.43 5.0469L10.7827 4.4215C10.539 4.2452 10.2266 4.0555 9.8682 3.9223C8.2483 3.2549 6.3089 3.587 4.9921 4.9044C3.7254 6.1726 3.3271 8.1225 4.0111 9.7864C4.5221 11.03 3.6844 11.9096 2.8407 12.7974C2.5417 13.1122 2.2417 13.4269 2 13.7601L5.8102 10.3523" />
+  </svg>
+);
+
+export const GrokIcon = styled(Icon).attrs({
+  'data-component-name': 'icons/GrokIcon/GrokIcon',
+})`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/index.ts

@@ -193,6 +193,7 @@ export * from '@redocly/theme/icons/SpinnerIcon/SpinnerIcon';
 export * from '@redocly/theme/icons/ChatGptIcon/ChatGptIcon';
 export * from '@redocly/theme/icons/CopyIcon/CopyIcon';
 export * from '@redocly/theme/icons/ClaudeIcon/ClaudeIcon';
+export * from '@redocly/theme/icons/GrokIcon/GrokIcon';
 export * from '@redocly/theme/icons/CleanIcon/CleanIcon';
 export * from '@redocly/theme/icons/GraphqlIcon/GraphqlIcon';
 export * from '@redocly/theme/icons/DeselectIcon/DeselectIcon';

package/src/markdoc/components/NumberedList/NumberedItem.tsx

@@ -63,11 +63,12 @@ export function NumberedItem({
         <MarkerContent className="numbered-item-marker-content">{index}</MarkerContent>
       )}
       {anchorId && (
-        <MarkerLink className="numbered-item-marker-link" $isDot={isDot}>
+        <MarkerLink className="numbered-item-marker-link" aria-hidden="true">
           <MarkerLinkIcon
             aria-hidden="true"
             focusable="false"
-            color="--md-numbered-list-marker-text-color"
+            size="var(--md-numbered-list-marker-link-size)"
+            color="--md-numbered-list-marker-link-icon-color"
           />
         </MarkerLink>
       )}
@@ -156,27 +157,25 @@ const MarkerContent = styled.span`
   justify-content: center;
 `;
 
-const MarkerLink = styled.span<{ $isDot?: boolean }>`
+const MarkerLink = styled.span`
+  position: absolute;
+  inset-inline-end: calc(100% + var(--md-numbered-list-marker-link-gap));
   display: none;
   align-items: center;
   justify-content: center;
 
-  svg {
-    width: var(--icon-width, 16px);
-    height: var(--icon-height, 16px);
+  &::before {
+    content: '';
+    position: absolute;
+    inset-block: 0;
+    inset-inline-start: 100%;
+    width: var(--md-numbered-list-marker-link-gap);
   }
-
-  ${({ $isDot }) =>
-    $isDot &&
-    css`
-      position: absolute;
-      inset-inline-end: calc(100% + var(--md-numbered-list-dot-link-gap));
-    `}
 `;
 
 const MarkerLinkIcon = styled(LinkIcon)`
   path:first-of-type {
-    fill: var(--md-numbered-list-marker-icon-bg-color);
+    fill: var(--md-numbered-list-marker-link-bg-color);
   }
 `;
 
@@ -256,18 +255,10 @@ const NumberedItemWrapper = styled.li<{ $size?: string; $isDot?: boolean }>`
     padding-bottom: 0;
   }
 
-  &:hover,
-  &:focus-within {
-    ${Marker} {
-      background-color: ${({ $isDot }) =>
-        $isDot ? 'var(--text-color-primary)' : 'var(--md-numbered-list-marker-bg-color-hover)'};
-    }
-
-    a ${Marker}:not([data-dot]) .numbered-item-marker-content {
-      display: none;
-    }
-
-    a ${Marker} .numbered-item-marker-link {
+  &:has(${MarkerRail} a:hover),
+  &:has(${MarkerRail} a:focus-visible),
+  &:has(${NumberedItemHeadline}:hover) {
+    .numbered-item-marker-link {
       display: flex;
     }
   }

package/src/markdoc/components/NumberedList/variables.ts

@@ -9,8 +9,6 @@ export const markdownNumberedList = css`
   --md-numbered-list-gap: var(--spacing-base); // @presenter Spacing
 
   --md-numbered-list-marker-bg-color: var(--color-warm-grey-2); // @presenter Color
-  --md-numbered-list-marker-bg-color-hover: var(--color-warm-grey-3); // @presenter Color
-  --md-numbered-list-marker-icon-bg-color: transparent; // @presenter Color
   --md-numbered-list-marker-text-color: var(--text-color-primary); // @presenter Color
   --md-numbered-list-marker-font-size: var(--font-size-base); // @presenter FontSize
 
@@ -21,7 +19,10 @@ export const markdownNumberedList = css`
   --md-numbered-list-icon-small-size: 12px; // @presenter Spacing
   --md-numbered-list-dot-size: 10px; // @presenter Spacing
   --md-numbered-list-dot-rail-padding-top: 7px; // @presenter Spacing
-  --md-numbered-list-dot-link-gap: 6px; // @presenter Spacing
+  --md-numbered-list-marker-link-gap: 10px; // @presenter Spacing
+  --md-numbered-list-marker-link-size: 20px; // @presenter Spacing
+  --md-numbered-list-marker-link-icon-color: var(--md-numbered-list-marker-text-color); // @presenter Color
+  --md-numbered-list-marker-link-bg-color: var(--bg-color-tonal); // @presenter Color
 
   --md-numbered-list-tail-bg-color: var(--md-numbered-list-marker-bg-color); // @presenter Color
   --md-numbered-list-tail-fade-gradient: linear-gradient(to bottom, var(--md-numbered-list-tail-bg-color), transparent); // @presenter Color

package/src/markdoc/default.ts

@@ -33,6 +33,7 @@ import { icon } from '@redocly/theme/markdoc/tags/icon';
 import { connectMcp } from '@redocly/theme/markdoc/tags/connect-mcp';
 import { loginButton } from '@redocly/theme/markdoc/tags/login-button';
 import { diagram } from '@redocly/theme/markdoc/tags/diagram';
+import { visibility } from '@redocly/theme/markdoc/tags/visibility';
 import { prompt } from '@redocly/theme/markdoc/tags/prompt';
 
 export const tags = {
@@ -61,5 +62,6 @@ export const tags = {
   [connectMcp.tagName]: connectMcp.schema,
   [loginButton.tagName]: loginButton.schema,
   [diagram.tagName]: diagram.schema,
+  [visibility.tagName]: visibility.schema,
   [prompt.tagName]: prompt.schema,
 };