@redocly/theme 0.71.0-next.0 → 0.71.0-next.2

package/lib/components/Dropdown/DropdownMenuItem.d.ts

@@ -1,4 +1,4 @@
-import type { CSSProperties, ReactNode, PropsWithChildren, JSX } from 'react';
+import type { KeyboardEvent, MouseEvent, CSSProperties, ReactNode, PropsWithChildren, JSX } from 'react';
 import type { LinkProps } from '../../core/types';
 export type DropdownMenuItemProps = Partial<Pick<LinkProps, 'to' | 'target' | 'external'>> & {
     prefix?: ReactNode;
@@ -12,7 +12,7 @@ export type DropdownMenuItemProps = Partial<Pick<LinkProps, 'to' | 'target' | 'e
     separator?: boolean;
     disabled?: boolean;
     dangerous?: boolean;
-    onAction?: () => void;
+    onAction?: (event: KeyboardEvent | MouseEvent) => void;
     active?: boolean;
 };
 export declare function DropdownMenuItem({ children, content, active, onAction, to, dangerous, prefix, suffix, disabled, separator, dataAttributes, className, separatorLine, style, role, ...otherProps }: PropsWithChildren<DropdownMenuItemProps>): JSX.Element;

package/lib/components/Dropdown/DropdownMenuItem.js

@@ -53,12 +53,12 @@ const styled_components_1 = __importStar(require("styled-components"));
 const Link_1 = require("../../components/Link/Link");
 function DropdownMenuItem(_a) {
     var { children, content, active, onAction, to, dangerous, prefix, suffix, disabled, separator, dataAttributes, className, separatorLine, style, role = 'menuitem' } = _a, otherProps = __rest(_a, ["children", "content", "active", "onAction", "to", "dangerous", "prefix", "suffix", "disabled", "separator", "dataAttributes", "className", "separatorLine", "style", "role"]);
-    const handleClick = () => {
-        onAction === null || onAction === void 0 ? void 0 : onAction();
+    const handleClick = (event) => {
+        onAction === null || onAction === void 0 ? void 0 : onAction(event);
     };
     const handleKeyDown = (event) => {
         if (event.key === 'Enter' || event.key === ' ') {
-            onAction === null || onAction === void 0 ? void 0 : onAction();
+            onAction === null || onAction === void 0 ? void 0 : onAction(event);
         }
     };
     className = className || '' + (active ? ' active' : '');

package/lib/core/constants/search.js

@@ -40,6 +40,10 @@ exports.AI_SEARCH_ERROR_CONFIG = {
 exports.AI_SEARCH_MAX_MESSAGE_LENGTH = 45000;
 exports.SEARCH_DEBOUNCE_TIME_MS = 500;
 exports.DEFAULT_KEYBOARD_SHORTCUTS = '⌘+K,CTRL+K';
+const discoverToolsDisplayText = {
+    inProgressText: 'Discovering available tools...',
+    completedText: 'Discovered available tools',
+};
 exports.TOOL_CALL_DISPLAY_TEXT = {
     [search_1.ToolCallName.SearchDocumentation]: {
         inProgressText: 'Searching documentation...',
@@ -69,10 +73,8 @@ exports.TOOL_CALL_DISPLAY_TEXT = {
         inProgressText: 'Running code...',
         completedText: 'Ran code',
     },
-    [search_1.ToolCallName.DescribeTools]: {
-        inProgressText: 'Discovering available tools...',
-        completedText: 'Discovered available tools',
-    },
+    [search_1.ToolCallName.DescribeTools]: discoverToolsDisplayText,
+    [search_1.ToolCallName.Discover]: discoverToolsDisplayText,
     [search_1.ToolCallName.ContactSupport]: {
         inProgressText: 'Opening the contact support option...',
         completedText: 'Offered to contact support',

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

@@ -153,5 +153,6 @@ export declare enum ToolCallName {
     GetFullApiDescription = "get-full-api-description",
     Execute = "execute",
     DescribeTools = "describe-tools",
+    Discover = "discover",
     ContactSupport = "contact-support"
 }

package/lib/core/types/search.js

@@ -16,6 +16,7 @@ var ToolCallName;
     ToolCallName["GetFullApiDescription"] = "get-full-api-description";
     ToolCallName["Execute"] = "execute";
     ToolCallName["DescribeTools"] = "describe-tools";
+    ToolCallName["Discover"] = "discover";
     ToolCallName["ContactSupport"] = "contact-support";
 })(ToolCallName || (exports.ToolCallName = ToolCallName = {}));
 //# sourceMappingURL=search.js.map

package/lib/core/utils/details.d.ts

@@ -1 +1,6 @@
 export declare function extendDetailsBehaviour(): () => void;
+/**
+ * The id a `<details>` element without one gets from its summary text; a URL hash with that id
+ * opens it. Empty for an empty summary.
+ */
+export declare function detailsAnchorId(summaryText: string): string;

package/lib/core/utils/details.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.extendDetailsBehaviour = extendDetailsBehaviour;
+exports.detailsAnchorId = detailsAnchorId;
 function extendDetailsBehaviour() {
     enhanceDetails();
     openDetailsFromHash();
@@ -9,6 +10,13 @@ function extendDetailsBehaviour() {
         window.removeEventListener('hashchange', openDetailsFromHash);
     };
 }
+/**
+ * The id a `<details>` element without one gets from its summary text; a URL hash with that id
+ * opens it. Empty for an empty summary.
+ */
+function detailsAnchorId(summaryText) {
+    return summaryText.replace(/\s+/g, '-').toLowerCase();
+}
 function openDetailsAndScroll(detailsElement) {
     detailsElement.setAttribute('open', '');
     setTimeout(() => {
@@ -21,11 +29,12 @@ function openDetailsAndScroll(detailsElement) {
 function enhanceDetails() {
     const existingIds = [];
     Array.from(document.getElementsByTagName('details')).forEach((detailsElement, index) => {
-        var _a, _b;
+        var _a;
+        var _b;
         if (detailsElement.id) {
             return;
         }
-        const generatedId = ((_b = (_a = detailsElement.querySelector('summary')) === null || _a === void 0 ? void 0 : _a.textContent) === null || _b === void 0 ? void 0 : _b.replace(/\s+/g, '-').toLowerCase()) ||
+        const generatedId = detailsAnchorId((_b = (_a = detailsElement.querySelector('summary')) === null || _a === void 0 ? void 0 : _a.textContent) !== null && _b !== void 0 ? _b : '') ||
             `details-${index}`;
         detailsElement.id = existingIds.includes(generatedId) ? `${generatedId}-${index}` : generatedId;
         existingIds.push(detailsElement.id);

package/lib/core/utils/search-ai-activity.js

@@ -40,10 +40,10 @@ function getSearchAiActivityStep(toolCall, isRunning, translate) {
 }
 function getToolCallLabel(toolCall, isCompleted, translate) {
     const detail = getToolCallDetail(toolCall);
-    if (toolCall.name === search_1.ToolCallName.Execute && detail) {
+    const builtInText = search_2.TOOL_CALL_DISPLAY_TEXT[toolCall.name];
+    if ((toolCall.name === search_1.ToolCallName.Execute || !builtInText) && detail) {
         return { label: detail };
     }
-    const builtInText = search_2.TOOL_CALL_DISPLAY_TEXT[toolCall.name];
     if (builtInText) {
         const text = isCompleted ? builtInText.completedText : builtInText.inProgressText;
         return detail ? { label: stripEllipsis(text), detail } : { label: text };
@@ -67,7 +67,9 @@ function getToolCallDetail(toolCall) {
         case search_1.ToolCallName.Execute:
             return getStringArg(toolCall.args, 'description');
         default:
-            return undefined;
+            return search_2.TOOL_CALL_DISPLAY_TEXT[toolCall.name]
+                ? undefined
+                : getStringArg(toolCall.args, 'description');
     }
 }
 function getStringArg(args, name) {

package/lib/markdoc/tags/visibility.d.ts

@@ -0,0 +1,15 @@
+import type { MarkdocSchemaWrapper } from '../../markdoc/tags/types';
+/** The part of a node the check reads; a stored plain-JSON AST node satisfies it too. */
+type VisibilityNodeLike = {
+    tag?: string;
+    attributes?: Record<string, unknown>;
+};
+/** True for a node whose content must never reach the rendered page. */
+export declare function isForAgentsOnly(node: VisibilityNodeLike): boolean;
+/**
+ * A `renderTag` that empties nodes hidden from the page and leaves every other tag to the
+ * caller's own walk. Used by the text extractors that read a raw AST, which no tag schema runs on.
+ */
+export declare function skipAgentsOnlyContent(node: VisibilityNodeLike): string | undefined;
+export declare const visibility: MarkdocSchemaWrapper;
+export {};

package/lib/markdoc/tags/visibility.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.visibility = void 0;
+exports.isForAgentsOnly = isForAgentsOnly;
+exports.skipAgentsOnlyContent = skipAgentsOnlyContent;
+/** True for a node whose content must never reach the rendered page. */
+function isForAgentsOnly(node) {
+    var _a;
+    return node.tag === 'visibility' && ((_a = node.attributes) === null || _a === void 0 ? void 0 : _a.for) === 'agents';
+}
+/**
+ * A `renderTag` that empties nodes hidden from the page and leaves every other tag to the
+ * caller's own walk. Used by the text extractors that read a raw AST, which no tag schema runs on.
+ */
+function skipAgentsOnlyContent(node) {
+    return isForAgentsOnly(node) ? '' : undefined;
+}
+exports.visibility = {
+    schema: {
+        attributes: {
+            for: { type: String, required: true, matches: ['humans', 'agents'] },
+        },
+        transform(node, config) {
+            return isForAgentsOnly(node) ? [] : node.transformChildren(config);
+        },
+        renderForLlms(node, { getBody }) {
+            return node.attributes.for === 'humans' ? '' : getBody();
+        },
+    },
+    tagName: 'visibility',
+};
+//# sourceMappingURL=visibility.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redocly/theme",
-  "version": "0.71.0-next.0",
+  "version": "0.71.0-next.2",
   "description": "Shared UI components lib",
   "keywords": [
     "theme",
@@ -22,6 +22,7 @@
     "./core/templates/*": "./lib/core/templates/*.js",
     "./core/contexts/*": "./lib/core/contexts/*.js",
     "./core/hooks/*": "./lib/core/hooks/*.js",
+    "./core/utils/*": "./lib/core/utils/*.js",
     "./core/hoc/*": "./lib/core/hoc/*.js",
     "./core/constants/*": "./lib/core/constants/*.js",
     "./ext/*": "./lib/ext/*.js",
@@ -68,7 +69,7 @@
     "webpack": "5.105.2"
   },
   "dependencies": {
-    "@redocly/config": "0.65.0",
+    "@redocly/config": "0.66.0",
     "@tanstack/react-query": "5.62.3",
     "@tanstack/react-virtual": "3.13.0",
     "@xyflow/react": "12.8.3",

package/src/components/Dropdown/DropdownMenuItem.tsx

@@ -1,7 +1,14 @@
 import React from 'react';
 import styled, { css } from 'styled-components';
 
-import type { KeyboardEvent, CSSProperties, ReactNode, PropsWithChildren, JSX } from 'react';
+import type {
+  KeyboardEvent,
+  MouseEvent,
+  CSSProperties,
+  ReactNode,
+  PropsWithChildren,
+  JSX,
+} from 'react';
 import type { LinkProps } from '@redocly/theme/core/types';
 
 import { Link } from '@redocly/theme/components/Link/Link';
@@ -21,7 +28,7 @@ export type DropdownMenuItemProps = Partial<Pick<LinkProps, 'to' | 'target' | 'e
   separator?: boolean;
   disabled?: boolean;
   dangerous?: boolean;
-  onAction?: () => void;
+  onAction?: (event: KeyboardEvent | MouseEvent) => void;
   active?: boolean;
 };
 
@@ -43,13 +50,13 @@ export function DropdownMenuItem({
   role = 'menuitem',
   ...otherProps
 }: PropsWithChildren<DropdownMenuItemProps>): JSX.Element {
-  const handleClick = () => {
-    onAction?.();
+  const handleClick = (event: MouseEvent) => {
+    onAction?.(event);
   };
 
   const handleKeyDown = (event: KeyboardEvent) => {
     if (event.key === 'Enter' || event.key === ' ') {
-      onAction?.();
+      onAction?.(event);
     }
   };
 

package/src/core/constants/search.ts

@@ -48,6 +48,11 @@ export const SEARCH_DEBOUNCE_TIME_MS = 500;
 
 export const DEFAULT_KEYBOARD_SHORTCUTS = '⌘+K,CTRL+K';
 
+const discoverToolsDisplayText = {
+  inProgressText: 'Discovering available tools...',
+  completedText: 'Discovered available tools',
+};
+
 export const TOOL_CALL_DISPLAY_TEXT: Partial<
   Record<string, { inProgressText: string; completedText: string }>
 > = {
@@ -79,10 +84,8 @@ export const TOOL_CALL_DISPLAY_TEXT: Partial<
     inProgressText: 'Running code...',
     completedText: 'Ran code',
   },
-  [ToolCallName.DescribeTools]: {
-    inProgressText: 'Discovering available tools...',
-    completedText: 'Discovered available tools',
-  },
+  [ToolCallName.DescribeTools]: discoverToolsDisplayText,
+  [ToolCallName.Discover]: discoverToolsDisplayText,
   [ToolCallName.ContactSupport]: {
     inProgressText: 'Opening the contact support option...',
     completedText: 'Offered to contact support',

package/src/core/types/search.ts

@@ -158,5 +158,6 @@ export enum ToolCallName {
   GetFullApiDescription = 'get-full-api-description',
   Execute = 'execute',
   DescribeTools = 'describe-tools',
+  Discover = 'discover',
   ContactSupport = 'contact-support',
 }

package/src/core/utils/details.ts

@@ -8,6 +8,14 @@ export function extendDetailsBehaviour() {
   };
 }
 
+/**
+ * The id a `<details>` element without one gets from its summary text; a URL hash with that id
+ * opens it. Empty for an empty summary.
+ */
+export function detailsAnchorId(summaryText: string): string {
+  return summaryText.replace(/\s+/g, '-').toLowerCase();
+}
+
 function openDetailsAndScroll(detailsElement: Element) {
   detailsElement.setAttribute('open', '');
   setTimeout(() => {
@@ -26,7 +34,7 @@ function enhanceDetails() {
     }
 
     const generatedId =
-      detailsElement.querySelector('summary')?.textContent?.replace(/\s+/g, '-').toLowerCase() ||
+      detailsAnchorId(detailsElement.querySelector('summary')?.textContent ?? '') ||
       `details-${index}`;
 
     detailsElement.id = existingIds.includes(generatedId) ? `${generatedId}-${index}` : generatedId;

package/src/core/utils/search-ai-activity.ts

@@ -66,10 +66,10 @@ function getToolCallLabel(
   translate: TFunction,
 ): { label: string; detail?: string } {
   const detail = getToolCallDetail(toolCall);
-  if (toolCall.name === ToolCallName.Execute && detail) {
+  const builtInText = TOOL_CALL_DISPLAY_TEXT[toolCall.name];
+  if ((toolCall.name === ToolCallName.Execute || !builtInText) && detail) {
     return { label: detail };
   }
-  const builtInText = TOOL_CALL_DISPLAY_TEXT[toolCall.name];
   if (builtInText) {
     const text = isCompleted ? builtInText.completedText : builtInText.inProgressText;
     return detail ? { label: stripEllipsis(text), detail } : { label: text };
@@ -93,7 +93,9 @@ function getToolCallDetail(toolCall: ToolCall): string | undefined {
     case ToolCallName.Execute:
       return getStringArg(toolCall.args, 'description');
     default:
-      return undefined;
+      return TOOL_CALL_DISPLAY_TEXT[toolCall.name]
+        ? undefined
+        : getStringArg(toolCall.args, 'description');
   }
 }
 

package/src/markdoc/tags/visibility.ts

@@ -0,0 +1,33 @@
+import type { Config, Node } from '@markdoc/markdoc';
+import type { MarkdocSchemaWrapper } from '@redocly/theme/markdoc/tags/types';
+
+/** The part of a node the check reads; a stored plain-JSON AST node satisfies it too. */
+type VisibilityNodeLike = { tag?: string; attributes?: Record<string, unknown> };
+
+/** True for a node whose content must never reach the rendered page. */
+export function isForAgentsOnly(node: VisibilityNodeLike): boolean {
+  return node.tag === 'visibility' && node.attributes?.for === 'agents';
+}
+
+/**
+ * A `renderTag` that empties nodes hidden from the page and leaves every other tag to the
+ * caller's own walk. Used by the text extractors that read a raw AST, which no tag schema runs on.
+ */
+export function skipAgentsOnlyContent(node: VisibilityNodeLike): string | undefined {
+  return isForAgentsOnly(node) ? '' : undefined;
+}
+
+export const visibility: MarkdocSchemaWrapper = {
+  schema: {
+    attributes: {
+      for: { type: String, required: true, matches: ['humans', 'agents'] },
+    },
+    transform(node: Node, config: Config) {
+      return isForAgentsOnly(node) ? [] : node.transformChildren(config);
+    },
+    renderForLlms(node: Node, { getBody }) {
+      return node.attributes.for === 'humans' ? '' : getBody();
+    },
+  },
+  tagName: 'visibility',
+};