@redocly/theme 0.61.0-next.2 → 0.61.0

package/lib/components/Catalog/CatalogEntity/CatalogEntityMetadata.js

@@ -50,11 +50,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.CatalogEntityMetadata = CatalogEntityMetadata;
 const react_1 = __importStar(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
-const ChevronDownIcon_1 = require("../../../icons/ChevronDownIcon/ChevronDownIcon");
 const JsonViewer_1 = require("../../../components/JsonViewer/JsonViewer");
 const utils_1 = require("../../../core/utils");
 const hooks_1 = require("../../../core/hooks");
 const CatalogEntityInfoBar_1 = require("../../../components/Catalog/CatalogEntity/CatalogEntityInfoBar");
+const ShowMoreButton_1 = require("../../../components/Catalog/CatalogEntity/ShowMoreButton");
 const MAX_INITIAL_ITEMS = 4;
 /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
 function renderMetadataValue(value) {
@@ -82,10 +82,7 @@ function CatalogEntityMetadata({ entity }) {
         visibleMetadata.map(([key, value]) => (react_1.default.createElement(CatalogEntityInfoBar_1.CatalogEntityInfoBar, { key: key, leftContent: react_1.default.createElement(Label, null,
                 (0, utils_1.capitalize)(key),
                 ":"), rightContent: react_1.default.createElement(Value, null, renderMetadataValue(value)), hoverEffect: false, isCodeBlock: (0, utils_1.isPlainObject)(value) || Array.isArray(value) }))),
-        hasMoreItems && (react_1.default.createElement(ShowMoreButton, { onClick: () => setIsOn(!isOn) },
-            isOn ? 'Show less' : 'Show more',
-            " ",
-            react_1.default.createElement(ChevronIcon, { "$isExpanded": isOn })))));
+        hasMoreItems && (react_1.default.createElement(ShowMoreButton_1.ShowMoreButton, { onClick: () => setIsOn(!isOn), isExpanded: isOn }, isOn ? 'Show less' : 'Show more'))));
 }
 const JsonViewerWrapper = (0, styled_components_1.default)(JsonViewer_1.JsonViewer) `
   text-align: left;
@@ -115,24 +112,4 @@ const Heading = styled_components_1.default.h2 `
   margin-top: 0;
   font-size: var(--catalog-metadata-heading-size);
 `;
-const ChevronIcon = (0, styled_components_1.default)(ChevronDownIcon_1.ChevronDownIcon) `
-  transform: ${({ $isExpanded }) => ($isExpanded ? 'rotate(180deg)' : 'rotate(0)')};
-  transition: transform 0.2s ease;
-`;
-const ShowMoreButton = styled_components_1.default.button `
-  background: none;
-  border: none;
-  display: flex;
-  align-items: center;
-  gap: var(--catalog-metadata-button-gap, 0.5rem);
-  cursor: pointer;
-  color: var(--catalog-metadata-button-color);
-  padding: 0;
-  font-weight: var(--font-weight-medium);
-  margin-top: var(--spacing-unit);
-
-  &:hover {
-    color: var(--catalog-metadata-button-color-hover);
-  }
-`;
 //# sourceMappingURL=CatalogEntityMetadata.js.map

package/lib/components/Catalog/CatalogEntity/CatalogEntityRelations/CatalogEntityRelations.js

@@ -51,11 +51,22 @@ function CatalogEntityRelations({ entity, entitiesCatalogConfig, initialRelation
     (0, react_1.useEffect)(() => {
         setFilter(ENTITY_DEFAULT_FILTERS[entity.key]);
     }, [entity.key]);
+    const combinedFilter = (0, react_1.useMemo)(() => {
+        const baseFilter = filter !== null && filter !== void 0 ? filter : ENTITY_DEFAULT_FILTERS[entity.type];
+        if (entity.version && entity.revision) {
+            const versionFilter = `version:"${entity.version}"`;
+            const revisionFilter = `revision:"${entity.revision}"`;
+            return baseFilter
+                ? `${baseFilter} AND ${versionFilter} AND ${revisionFilter}`
+                : `${versionFilter} AND ${revisionFilter}`;
+        }
+        return baseFilter;
+    }, [filter, entity.version, entity.type, entity.revision]);
     const { items: relations, query } = useFetchCatalogEntitiesRelations({
         entityKey: entity.key,
         search: searchQuery,
         sort: sortOption !== null && sortOption !== void 0 ? sortOption : undefined,
-        filter: filter !== null && filter !== void 0 ? filter : ENTITY_DEFAULT_FILTERS[entity.type],
+        filter: combinedFilter,
         limit: 10,
     }, initialRelations);
     const shouldShowLoadMore = query.hasNextPage ||

package/lib/components/Catalog/CatalogEntity/ShowMoreButton.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export type ShowMoreButtonProps = {
+    onClick: () => void;
+    children: React.ReactNode;
+    className?: string;
+    isExpanded?: boolean;
+};
+export declare function ShowMoreButton({ onClick, children, className, isExpanded, }: ShowMoreButtonProps): React.ReactElement;

package/lib/components/Catalog/CatalogEntity/ShowMoreButton.js

@@ -0,0 +1,35 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ShowMoreButton = ShowMoreButton;
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const ChevronDownIcon_1 = require("../../../icons/ChevronDownIcon/ChevronDownIcon");
+function ShowMoreButton({ onClick, children, className, isExpanded = false, }) {
+    return (react_1.default.createElement(BaseShowMoreButton, { type: "button", onClick: onClick, className: className },
+        children,
+        react_1.default.createElement(ChevronIcon, { "$isExpanded": isExpanded })));
+}
+const BaseShowMoreButton = styled_components_1.default.button `
+  all: unset;
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  background: none;
+  border: none;
+  gap: var(--catalog-show-more-button-gap);
+  color: var(--catalog-show-more-button-color);
+  padding: 0;
+  margin-top: var(--spacing-unit);
+
+  &:hover {
+    color: var(--catalog-show-more-button-color-hover);
+  }
+`;
+const ChevronIcon = (0, styled_components_1.default)(ChevronDownIcon_1.ChevronDownIcon) `
+  transform: ${({ $isExpanded }) => ($isExpanded ? 'rotate(180deg)' : 'rotate(0)')};
+  transition: transform 0.2s ease;
+`;
+//# sourceMappingURL=ShowMoreButton.js.map

package/lib/components/Catalog/CatalogTableView/CatalogTableViewRow.d.ts

@@ -6,6 +6,8 @@ export type BaseEntity = {
     type: string;
     title: string;
     summary?: string | null;
+    revision?: string | null;
+    version?: string | null;
 };
 export type CatalogTableViewRowProps<T extends BaseEntity> = {
     entity: T;

package/lib/components/Catalog/CatalogTableView/CatalogTableViewRow.js

@@ -64,8 +64,11 @@ const CatalogTableViewRow = ({ entity, entitiesCatalogConfig, catalogConfig, col
     const { getEntityDetailsLink } = (0, hooks_1.useCatalogEntityDetails)({
         catalogConfig,
         entitiesCatalogConfig,
+        revision: entity.revision,
+        version: entity.version,
     });
-    return (react_1.default.createElement(TableRow, { key: entity.id, "$columnsWidths": columns.map((column) => column.width || '1fr'), "$columnsMinWidths": columns.map((column) => column.minWidth || 'auto'), to: getEntityDetailsLink(entity) + '?search=', onClick: () => onRowClick(entity), style: { color: 'var(--catalog-page-wrapper-text-color)' }, "data-component-name": "Catalog/CatalogTableView/CatalogTableViewRow" }, columns.map((column) => (react_1.default.createElement(TableCell, { key: column.key, className: column.key === 'entity' ? '' : 'tooltip-cell-container' }, column.render(entity))))));
+    const link = getEntityDetailsLink({ key: entity.key, type: entity.type });
+    return (react_1.default.createElement(TableRow, { key: entity.id, "$columnsWidths": columns.map((column) => column.width || '1fr'), "$columnsMinWidths": columns.map((column) => column.minWidth || 'auto'), to: link, onClick: () => onRowClick(entity), style: { color: 'var(--catalog-page-wrapper-text-color)' }, "data-component-name": "Catalog/CatalogTableView/CatalogTableViewRow" }, columns.map((column) => (react_1.default.createElement(TableCell, { key: column.key, className: column.key === 'entity' ? '' : 'tooltip-cell-container' }, column.render(entity))))));
 };
 exports.CatalogTableViewRow = CatalogTableViewRow;
 const TableRow = (0, styled_components_1.default)(Link_1.Link) `

package/lib/components/Catalog/variables.js

@@ -237,6 +237,13 @@ exports.catalog = (0, styled_components_1.css) `
   --catalog-metadata-column-half-gap: var(--spacing-sm);
   --catalog-metadata-heading-size: var(--font-size-md);
 
+  /**
+    * @tokens Catalog show more button
+    */
+  --catalog-show-more-button-gap: 0.5rem;
+  --catalog-show-more-button-color: var(--text-color-primary);
+  --catalog-show-more-button-color-hover: var(--text-color-secondary);
+
   /**
     * @tokens Catalog arrow circle
     */
@@ -429,6 +436,111 @@ exports.catalog = (0, styled_components_1.css) `
   --catalog-entity-relations-edge-label-font-size: 12px;
   --catalog-entity-relations-edge-label-line-height: 1.2;
   // @tokens End
+
+  /**
+    * @tokens Catalog history button
+    */
+  --catalog-history-separator-border-color: var(--border-color-secondary);
+  --catalog-history-separator-margin-bottom: var(--spacing-sm);
+  --catalog-history-item-padding: var(--spacing-xxs);
+  --catalog-history-item-margin-bottom: calc(var(--spacing-xxs) * -1);
+  --catalog-history-item-gap: var(--spacing-xxs);
+  --catalog-history-item-border-radius: var(--menu-item-label-border-radius);
+  --catalog-history-item-bg-color-hover: var(--menu-item-bg-color-hover);
+  --catalog-history-icon-size: 16px;
+  --catalog-history-text-font-family: var(--font-family-base);
+  --catalog-history-text-font-size: var(--font-size-base);
+  --catalog-history-text-font-weight: var(--font-weight-regular);
+  --catalog-history-text-line-height: var(--line-height-base);
+  --catalog-history-text-color: var(--text-color-primary);
+  --catalog-history-pill-gap: var(--spacing-xxs);
+  --catalog-history-pill-padding-vertical: 1px;
+  --catalog-history-pill-padding-horizontal: var(--spacing-xs);
+  --catalog-history-pill-border-color: var(--border-color-primary);
+  --catalog-history-pill-border-radius: 12px;
+  --catalog-history-pill-icon-size: 14px;
+  --catalog-history-pill-icon-color: var(--color-green-8);
+  --catalog-history-pill-font-family: var(--font-family-base);
+  --catalog-history-pill-font-size: var(--font-size-base);
+  --catalog-history-pill-line-height: var(--line-height-base);
+  --catalog-history-pill-text-color: var(--text-color-primary);
+  // @tokens End
+
+  /**
+    * @tokens Catalog history sidebar
+    */
+  --catalog-history-sidebar-width: 320px;
+  --catalog-history-sidebar-bg-color: var(--sidebar-bg-color);
+  --catalog-history-sidebar-border-color: var(--border-color-secondary);
+
+  --catalog-history-sidebar-header-padding: var(--spacing-base) var(--spacing-sm) var(--spacing-base);
+  --catalog-history-sidebar-header-font-family: var(--font-family-base);
+  --catalog-history-sidebar-header-font-size: var(--font-size-base);
+  --catalog-history-sidebar-header-font-weight: var(--font-weight-semibold);
+  --catalog-history-sidebar-header-line-height: var(--line-height-base);
+  --catalog-history-sidebar-header-letter-spacing: 0;
+  --catalog-history-sidebar-header-color: var(--text-color-primary);
+
+  --catalog-history-sidebar-close-button-size: 32px;
+  --catalog-history-sidebar-close-button-border-radius: var(--border-radius-md);
+  --catalog-history-sidebar-close-button-bg-color-hover: var(--color-hover-base);
+  --catalog-history-sidebar-close-icon-color: var(--text-color-primary);
+
+  --catalog-history-sidebar-content-padding: 0 var(--spacing-sm);
+  --catalog-history-sidebar-content-margin-top: calc(var(--spacing-xxs) * -1);
+
+  --catalog-history-sidebar-version-header-padding: var(--spacing-xs) var(--spacing-xxs);
+  --catalog-history-sidebar-version-header-border-radius: var(--border-radius-md);
+  --catalog-history-sidebar-version-header-bg-color-hover: var(--color-hover-base);
+
+  --catalog-history-sidebar-version-icon-size: 32px;
+  --catalog-history-sidebar-version-icon-color: var(--text-color-secondary);
+  --catalog-history-sidebar-version-icon-color-current: var(--color-static-white);
+  --catalog-history-sidebar-version-icon-margin-right: var(--spacing-xs);
+  --catalog-history-sidebar-chevron-icon-color: var(--text-color-secondary);
+  --catalog-history-sidebar-version-info-gap: 2px;
+
+  --catalog-history-sidebar-version-title-font-family: var(--font-family-base);
+  --catalog-history-sidebar-version-title-font-size: var(--font-size-base);
+  --catalog-history-sidebar-version-title-font-weight: var(--font-weight-medium);
+  --catalog-history-sidebar-version-title-line-height: var(--line-height-base);
+  --catalog-history-sidebar-version-title-color: var(--color-warm-grey-7);
+
+  --catalog-history-sidebar-version-date-font-family: var(--font-family-base);
+  --catalog-history-sidebar-version-date-font-size: var(--font-size-sm);
+  --catalog-history-sidebar-version-date-font-weight: var(--font-weight-regular);
+  --catalog-history-sidebar-version-date-line-height: var(--line-height-sm);
+  --catalog-history-sidebar-version-date-color: var(--color-warm-grey-7);
+
+  --catalog-history-sidebar-revisions-padding-left: 40px;
+
+  --catalog-history-sidebar-revision-item-padding: var(--spacing-xs) var(--spacing-sm);
+  --catalog-history-sidebar-revision-item-border-radius: var(--border-radius-md);
+  --catalog-history-sidebar-revision-item-bg-color-hover: var(--bg-color-hover);
+
+  --catalog-history-sidebar-revision-name-font-family: var(--font-family-base);
+  --catalog-history-sidebar-revision-name-font-size: var(--font-size-base);
+  --catalog-history-sidebar-revision-name-font-weight: var(--font-weight-regular);
+  --catalog-history-sidebar-revision-name-line-height: var(--line-height-base);
+  --catalog-history-sidebar-revision-name-color: var(--text-color-primary);
+
+  --catalog-history-sidebar-revision-date-font-family: var(--font-family-base);
+  --catalog-history-sidebar-revision-date-font-size: var(--font-size-sm);
+  --catalog-history-sidebar-revision-date-font-weight: var(--font-weight-regular);
+  --catalog-history-sidebar-revision-date-line-height: var(--line-height-sm);
+  --catalog-history-sidebar-revision-date-color: var(--color-warm-grey-7);
+
+  --catalog-history-sidebar-revision-line-color: var(--border-color-secondary);
+  --catalog-history-sidebar-revision-item-bg-color-active: var(--bg-color-active);
+
+  --catalog-history-sidebar-revisions-limit-message-color: var(--color-warm-grey-6);
+
+  /**
+   * @tokens Catalog history tag border radius
+   */
+  --catalog-history-sidebar-version-tag-border-radius: var(--border-radius-xl);
+  --catalog-history-sidebar-revision-tag-border-radius: var(--border-radius-xl);
+  // @tokens End
 `;
 /* eslint-enable theme/no-raw-colors-in-styles */
 //# sourceMappingURL=variables.js.map

package/lib/components/Menu/variables.js

@@ -42,6 +42,7 @@ exports.menu = (0, styled_components_1.css) `
   --menu-item-padding-vertical: var(--spacing-unit); // @presenter Spacing
   --menu-item-padding-horizontal: var(--spacing-xxs); // @presenter Spacing
   --menu-item-nested-offset: var(--spacing-sm); // @presenter Spacing
+  --menu-header-container-gap: var(--spacing-sm); // @presenter Spacing
 
   /**
    * @tokens Menu item label

package/lib/components/Tooltip/Tooltip.js

@@ -113,6 +113,8 @@ function TooltipComponent({ children, isOpen, tip, withArrow = true, placement =
         onMouseEnter: handleOpen,
         onMouseLeave: handleClose,
         onClick: handleClose,
+        onFocus: handleOpen,
+        onBlur: handleClose,
     };
     return (react_1.default.createElement(TooltipWrapper, Object.assign({ ref: ref }, controllers, { className: `tooltip-${className}`, "data-component-name": "Tooltip/Tooltip" }),
         children,

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

@@ -13,3 +13,4 @@ export declare enum GraphCustomNodeType {
 export declare enum GraphCustomEdgeType {
     CatalogEdge = "catalogEdge"
 }
+export declare const VERSION_NOT_SPECIFIED = "not_specified_version";

package/lib/core/constants/catalog.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.GraphCustomEdgeType = exports.GraphCustomNodeType = exports.GraphHandleType = exports.relationTypeMap = exports.reverseRelationMap = exports.PREDEFINED_ENTITY_TYPES = exports.CATALOG_TAG_MAX_LENGTH = void 0;
+exports.VERSION_NOT_SPECIFIED = exports.GraphCustomEdgeType = exports.GraphCustomNodeType = exports.GraphHandleType = exports.relationTypeMap = exports.reverseRelationMap = exports.PREDEFINED_ENTITY_TYPES = exports.CATALOG_TAG_MAX_LENGTH = void 0;
 exports.CATALOG_TAG_MAX_LENGTH = 15;
 exports.PREDEFINED_ENTITY_TYPES = [
     'service',
@@ -82,4 +82,5 @@ var GraphCustomEdgeType;
 (function (GraphCustomEdgeType) {
     GraphCustomEdgeType["CatalogEdge"] = "catalogEdge";
 })(GraphCustomEdgeType || (exports.GraphCustomEdgeType = GraphCustomEdgeType = {}));
+exports.VERSION_NOT_SPECIFIED = 'not_specified_version';
 //# sourceMappingURL=catalog.js.map

package/lib/core/hooks/catalog/use-catalog-entity-details.d.ts

@@ -3,9 +3,11 @@ import type { BffCatalogEntity } from '../../../core/types';
 type Props = {
     catalogConfig: CatalogEntityConfig;
     entitiesCatalogConfig?: EntitiesCatalogConfig;
+    revision?: string | null;
+    version?: string | null;
 };
 type BaseEntity = Pick<BffCatalogEntity, 'key' | 'type'>;
-export declare function useCatalogEntityDetails({ catalogConfig, entitiesCatalogConfig }: Props): {
+export declare function useCatalogEntityDetails({ catalogConfig, entitiesCatalogConfig, revision, version, }: Props): {
     getEntityDetailsLink: (entity: BaseEntity) => string;
 };
 export {};

package/lib/core/hooks/catalog/use-catalog-entity-details.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useCatalogEntityDetails = useCatalogEntityDetails;
 const urls_1 = require("../../utils/urls");
-function useCatalogEntityDetails({ catalogConfig, entitiesCatalogConfig }) {
+function useCatalogEntityDetails({ catalogConfig, entitiesCatalogConfig, revision, version, }) {
     const getCatalogSpecificConfigByEntityTypeIncluded = (entity) => {
         var _a;
         if (!entitiesCatalogConfig) {
@@ -14,12 +14,19 @@ function useCatalogEntityDetails({ catalogConfig, entitiesCatalogConfig }) {
         });
     };
     const getEntityDetailsLink = (entity) => {
-        const pathPrefix = (0, urls_1.getPathPrefix)();
         const catalogSpecificConfig = getCatalogSpecificConfigByEntityTypeIncluded(entity);
-        if (!catalogSpecificConfig || !entitiesCatalogConfig) {
-            return `${pathPrefix}/catalogs/${catalogConfig.slug}/entities/${entity.key}`;
+        const basePath = !catalogSpecificConfig || !entitiesCatalogConfig
+            ? (0, urls_1.withPathPrefix)(`/catalogs/${catalogConfig.slug}/entities/${entity.key}`)
+            : (0, urls_1.withPathPrefix)(`/catalogs/${catalogSpecificConfig.slug}/entities/${entity.key}`);
+        const params = new URLSearchParams();
+        if (revision) {
+            params.set('revision', revision);
         }
-        return `${pathPrefix}/catalogs/${catalogSpecificConfig.slug}/entities/${entity.key}`;
+        if (version !== undefined) {
+            params.set('version', version !== null && version !== void 0 ? version : '');
+        }
+        params.set('search', '');
+        return `${basePath}?${params.toString()}`;
     };
     return { getEntityDetailsLink };
 }

package/lib/core/hooks/use-color-switcher.js

@@ -2,28 +2,27 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useColorSwitcher = void 0;
 const react_1 = require("react");
+const hooks_1 = require("../../core/hooks");
 const use_theme_config_1 = require("./use-theme-config");
 const use_theme_hooks_1 = require("./use-theme-hooks");
 const use_store_1 = require("./use-store");
 const constants_1 = require("../constants");
-const js_utils_1 = require("../utils/js-utils");
 const COLOR_MODE_KEY = 'colorSchema';
 const colorModeStore = (0, use_store_1.createStore)({
     storageKey: COLOR_MODE_KEY,
 });
 const useColorSwitcher = () => {
-    var _a;
     const themeSettings = (0, use_theme_config_1.useThemeConfig)();
     const { useTelemetry } = (0, use_theme_hooks_1.useThemeHooks)();
     const telemetry = useTelemetry();
     const themeColorMode = themeSettings.colorMode;
     const modes = (0, react_1.useMemo)(() => (themeColorMode === null || themeColorMode === void 0 ? void 0 : themeColorMode.modes) || [constants_1.DEFAULT_COLOR_MODES.LIGHT, constants_1.DEFAULT_COLOR_MODES.DARK], [themeColorMode]);
-    const documentMode = (0, react_1.useMemo)(() => {
-        if (!(0, js_utils_1.isBrowser)())
-            return;
-        return Array.from(document.documentElement.classList).find((c) => modes.includes(c));
-    }, [modes]);
-    const [activeColorMode, setActiveColorMode] = (0, use_store_1.useStore)(colorModeStore, (_a = documentMode !== null && documentMode !== void 0 ? documentMode : modes[0]) !== null && _a !== void 0 ? _a : constants_1.DEFAULT_COLOR_MODES.LIGHT);
+    const defaultMode = modes[0] || constants_1.DEFAULT_COLOR_MODES.LIGHT;
+    const [activeColorMode, setActiveColorMode] = (0, use_store_1.useStore)(colorModeStore, defaultMode);
+    (0, hooks_1.useMount)(() => {
+        const activeMode = Array.from(document.documentElement.classList).find((c) => modes.includes(c));
+        setActiveColorMode(activeMode || defaultMode);
+    });
     const switchColorMode = (mode) => {
         if (mode && !modes.includes(mode)) {
             return;

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

@@ -23,6 +23,13 @@ const use_mcp_config_1 = require("./use-mcp-config");
 const clipboard_service_1 = require("../utils/clipboard-service");
 const dom_1 = require("../utils/dom");
 const mcp_1 = require("../utils/mcp");
+function createPageActionResource(pageSlug, pageUrl) {
+    return {
+        id: pageSlug,
+        object: 'page',
+        uri: pageUrl,
+    };
+}
 const DEFAULT_ENABLED_ACTIONS = [
     'copy',
     'view',
@@ -33,10 +40,11 @@ const DEFAULT_ENABLED_ACTIONS = [
 ];
 function usePageActions(pageSlug, mcpUrl, actions) {
     var _a, _b, _c;
-    const { useTranslate, usePageData, usePageProps, usePageSharedData } = (0, use_theme_hooks_1.useThemeHooks)();
+    const { useTranslate, usePageData, usePageProps, usePageSharedData, useTelemetry } = (0, use_theme_hooks_1.useThemeHooks)();
     const { translate } = useTranslate();
     const themeConfig = (0, use_theme_config_1.useThemeConfig)();
     const pageProps = usePageProps();
+    const telemetry = useTelemetry();
     const openApiSharedData = usePageSharedData('openAPIDocsStore');
     const mcpConfig = (0, use_mcp_config_1.useMCPConfig)();
     const shouldHideAllActions = shouldHidePageActions(pageProps, themeConfig, (_a = openApiSharedData === null || openApiSharedData === void 0 ? void 0 : openApiSharedData.options) === null || _a === void 0 ? void 0 : _a.excludeFromSearch);
@@ -49,8 +57,18 @@ function usePageActions(pageSlug, mcpUrl, actions) {
         const config = requiresMcpUrl
             ? { serverName: mcpConfig.serverName, url: mcpUrl || '' }
             : { serverName: mcpConfig.serverName, url: mcpConfig.serverUrl || '' };
-        return createMCPAction({ clientType, mcpConfig: config, translate });
-    }, [mcpUrl, mcpConfig, translate]);
+        const isDocsMcp = !requiresMcpUrl;
+        const origin = dom_1.IS_BROWSER ? window.location.origin : '';
+        const pageUrl = `${origin}${pageSlug}`;
+        return createMCPAction({
+            clientType,
+            mcpConfig: config,
+            translate,
+            onClickCallback: isDocsMcp
+                ? () => telemetry.sendPageActionsButtonClickedMessage(Object.assign(Object.assign({}, createPageActionResource(pageSlug, pageUrl)), { action_type: `docs-mcp-${clientType}` }))
+                : undefined,
+        });
+    }, [mcpUrl, mcpConfig, translate, telemetry, pageSlug]);
     const result = (0, react_1.useMemo)(() => {
         var _a, _b, _c;
         if (shouldHideAllActions) {
@@ -60,10 +78,11 @@ function usePageActions(pageSlug, mcpUrl, actions) {
             ? window.location.origin
             : ((_a = globalThis['SSR_HOSTNAME']) !== null && _a !== void 0 ? _a : '');
         const normalizedSlug = pageSlug.startsWith('/') ? pageSlug : '/' + pageSlug;
+        const pageUrl = `${origin}${normalizedSlug}`;
         const mdPageUrl = new URL(origin + normalizedSlug + (normalizedSlug === '/' ? 'index.html.md' : '.md')).toString();
         const actionHandlers = {
-            'docs-mcp-cursor': createMCPHandler('cursor'),
-            'docs-mcp-vscode': createMCPHandler('vscode'),
+            'docs-mcp-cursor': createMCPHandler('cursor', false),
+            'docs-mcp-vscode': createMCPHandler('vscode', false),
             'mcp-cursor': createMCPHandler('cursor', true),
             'mcp-vscode': createMCPHandler('vscode', true),
             copy: () => ({
@@ -79,6 +98,7 @@ function usePageActions(pageSlug, mcpUrl, actions) {
                         }
                         const text = yield result.text();
                         clipboard_service_1.ClipboardService.copyCustom(text);
+                        telemetry.sendPageActionsButtonClickedMessage(Object.assign(Object.assign({}, createPageActionResource(pageSlug, pageUrl)), { action_type: 'copy' }));
                     }
                     catch (error) {
                         console.error(error);
@@ -91,6 +111,9 @@ function usePageActions(pageSlug, mcpUrl, actions) {
                 description: translate('page.actions.viewAsMdDescription', 'Open this page as Markdown'),
                 iconComponent: MarkdownFullIcon_1.MarkdownFullIcon,
                 link: mdPageUrl,
+                onClick: () => {
+                    telemetry.sendPageActionsButtonClickedMessage(Object.assign(Object.assign({}, createPageActionResource(pageSlug, pageUrl)), { action_type: 'view' }));
+                },
             }),
             chatgpt: () => {
                 if (!isPublic) {
@@ -102,6 +125,9 @@ function usePageActions(pageSlug, mcpUrl, actions) {
                     description: translate('page.actions.chatGptDescription', 'Get insights from ChatGPT'),
                     iconComponent: ChatGptIcon_1.ChatGptIcon,
                     link: getExternalAiPromptLink('https://chat.openai.com', mdPageUrl),
+                    onClick: () => {
+                        telemetry.sendPageActionsButtonClickedMessage(Object.assign(Object.assign({}, createPageActionResource(pageSlug, pageUrl)), { action_type: 'chatgpt' }));
+                    },
                 };
             },
             claude: () => {
@@ -114,6 +140,9 @@ function usePageActions(pageSlug, mcpUrl, actions) {
                     description: translate('page.actions.claudeDescription', 'Get insights from Claude'),
                     iconComponent: ClaudeIcon_1.ClaudeIcon,
                     link: getExternalAiPromptLink('https://claude.ai/new', mdPageUrl),
+                    onClick: () => {
+                        telemetry.sendPageActionsButtonClickedMessage(Object.assign(Object.assign({}, createPageActionResource(pageSlug, pageUrl)), { action_type: 'claude' }));
+                    },
                 };
             },
         };
@@ -128,6 +157,7 @@ function usePageActions(pageSlug, mcpUrl, actions) {
         translate,
         isPublic,
         createMCPHandler,
+        telemetry,
     ]);
     return result;
 }
@@ -137,10 +167,11 @@ function getExternalAiPromptLink(baseUrl, mdPageUrl) {
     url.searchParams.set('q', externalAiPrompt);
     return url.toString();
 }
-function createMCPAction({ clientType, mcpConfig, translate }) {
+function createMCPAction({ clientType, mcpConfig, translate, onClickCallback, }) {
     const url = (0, mcp_1.generateMCPDeepLink)(clientType, mcpConfig);
     const sharedProps = {
         onClick: () => {
+            onClickCallback === null || onClickCallback === void 0 ? void 0 : onClickCallback();
             window.open(url, '_blank');
         },
     };

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

@@ -1,6 +1,7 @@
 export declare const useTelemetryFallback: () => {
     send: () => void;
     sendPageViewedMessage: () => void;
+    sendPageActionsButtonClickedMessage: () => void;
     sendErrorMessage: () => void;
     sendClientErrorMessage: () => void;
     sendBreadcrumbClickedMessage: () => void;
@@ -61,6 +62,7 @@ export declare const useTelemetryFallback: () => {
     sendAsyncapiDocsMessageClickedMessage: () => void;
     sendAsyncapiDocsServerModalOpenedMessage: () => void;
     sendAsyncapiDocsDownloadDefinitionClickedMessage: () => void;
+    sendAsyncapiDocsReferencedInClickedMessage: () => void;
     sendGraphqlDocsViewedMessage: () => void;
     sendGraphqlDocsPerformanceMetricsMessage: () => void;
     sendGraphqlDocsReferencedInLinkClickedMessage: () => void;

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

@@ -6,6 +6,7 @@ exports.useTelemetryFallback = void 0;
 const useTelemetryFallback = () => ({
     send: () => { },
     sendPageViewedMessage: () => { },
+    sendPageActionsButtonClickedMessage: () => { },
     sendErrorMessage: () => { },
     sendClientErrorMessage: () => { },
     sendBreadcrumbClickedMessage: () => { },
@@ -66,6 +67,7 @@ const useTelemetryFallback = () => ({
     sendAsyncapiDocsMessageClickedMessage: () => { },
     sendAsyncapiDocsServerModalOpenedMessage: () => { },
     sendAsyncapiDocsDownloadDefinitionClickedMessage: () => { },
+    sendAsyncapiDocsReferencedInClickedMessage: () => { },
     sendGraphqlDocsViewedMessage: () => { },
     sendGraphqlDocsPerformanceMetricsMessage: () => { },
     sendGraphqlDocsReferencedInLinkClickedMessage: () => { },

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

@@ -33,10 +33,6 @@ export type UseCatalogResponse = {
     layout: LayoutVariant;
     collapsedSidebar: boolean;
 };
-export type UseCatalogFetchCatalogEntities = (params: CatalogApiParams, initialData?: BffCatalogEntityList) => CatalogApiResults<BffCatalogEntity>;
-export type UseCatalogFetchCatalogEntitiesRelations = (params: CatalogApiParams & {
-    entityKey: string;
-}, initialData?: BffCatalogRelatedEntityList) => CatalogApiResults<BffCatalogRelatedEntity>;
 export type UseCatalogSortResponse = {
     sortOption: SortOption | null;
     setSortOption: (option: SortOption | null) => void;
@@ -109,6 +105,7 @@ export type CatalogApiParams = {
     filter?: string;
     sort?: string;
     search?: string;
+    entityVersion?: string | null;
 };
 export type UseCatalogEntitiesProps = {
     entitiesTypes: string[];
@@ -136,6 +133,7 @@ export type BffCatalogRelatedEntity = {
     sourceFile?: string | null;
     metadata?: Record<string, any>;
     version?: string | null;
+    revision?: string | null;
     readonly createdAt: string | null;
     readonly updatedAt: string | null;
 };
@@ -171,6 +169,7 @@ export type BffCatalogEntity = {
     readonly revision: string;
     readonly isCurrent?: boolean | null;
     readonly isDefaultVersion?: boolean | null;
+    readonly isDeleted?: boolean | null;
     readonly createdAt: string;
     readonly updatedAt: string;
 };
@@ -189,5 +188,35 @@ export type Page = {
     limit: number;
     total: number;
 };
+export type BffCatalogEntityRevision = {
+    readonly version: string | null;
+    readonly revision: string | null;
+    readonly isCurrent: boolean | null;
+    readonly isDefaultVersion: boolean | null;
+    readonly createdAt: string | null;
+    readonly updatedAt: string | null;
+};
+export type BffCatalogEntityRevisionList = BffCatalogList<BffCatalogEntityRevision>;
 export type EntityRelationType = (typeof ENTITY_RELATION_TYPES)[number];
 export type ListType = 'default' | 'team' | 'api-operation' | 'data-schema';
+export type CatalogEntityRevision = {
+    name: string;
+    date: string;
+    revisionDate: string | null;
+    isActive?: boolean;
+    isCurrent?: boolean;
+};
+export type CatalogEntityVersionHistoryGroup = {
+    version: string;
+    date: string;
+    isCurrent?: boolean;
+    isExpanded?: boolean;
+    revisions?: CatalogEntityRevision[];
+    singleRevisionDate?: string | null;
+    hasCurrentRevisionFromBackend?: boolean;
+    isDefaultVersion?: boolean;
+};
+export type SidebarConnectedEntity = {
+    key: string;
+    version?: string;
+};