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

package/lib/markdoc/components/NumberedList/NumberedItem.d.ts

@@ -0,0 +1,25 @@
+import type { JSX, PropsWithChildren, ReactNode } from 'react';
+export declare const NumberedListType: {
+    readonly ICON: 'icon';
+    readonly NUMBER: 'number';
+    readonly DOT: 'dot';
+};
+export type NumberedListType = (typeof NumberedListType)[keyof typeof NumberedListType];
+export declare const NumberedListSize: {
+    readonly SMALL: 'small';
+    readonly MEDIUM: 'medium';
+};
+export type NumberedListSize = (typeof NumberedListSize)[keyof typeof NumberedListSize];
+export type NumberedItemProps = PropsWithChildren<{
+    headline?: ReactNode;
+    anchorId?: string;
+    headlineLevel?: number;
+    icon?: string | ReactNode;
+    iconRawContent?: string;
+    className?: string;
+    type?: NumberedListType;
+    size?: NumberedListSize;
+    index?: number;
+    isLast?: boolean;
+}>;
+export declare function NumberedItem({ headline, anchorId, headlineLevel, icon, iconRawContent, className, type, size, index, isLast, children, }: NumberedItemProps): JSX.Element;

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

@@ -0,0 +1,217 @@
+"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;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NumberedListSize = exports.NumberedListType = void 0;
+exports.NumberedItem = NumberedItem;
+const react_1 = __importStar(require("react"));
+const styled_components_1 = __importStar(require("styled-components"));
+const GenericIcon_1 = require("../../../icons/GenericIcon/GenericIcon");
+const LinkIcon_1 = require("../../../icons/LinkIcon/LinkIcon");
+exports.NumberedListType = {
+    ICON: 'icon',
+    NUMBER: 'number',
+    DOT: 'dot',
+};
+exports.NumberedListSize = {
+    SMALL: 'small',
+    MEDIUM: 'medium',
+};
+function NumberedItem({ headline, anchorId, headlineLevel, icon, iconRawContent, className, type = exports.NumberedListType.NUMBER, size = exports.NumberedListSize.MEDIUM, index = 1, isLast = true, children, }) {
+    const isDot = type === exports.NumberedListType.DOT;
+    const headlineTextId = anchorId ? `${anchorId}-heading-text` : undefined;
+    const marker = (react_1.default.createElement(Marker, { $type: type, $size: size, "data-dot": isDot || undefined },
+        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" })))));
+    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
+                ? { 'aria-labelledby': headlineTextId }
+                : { 'aria-label': 'Link to this item' })), marker)) : (marker),
+            react_1.default.createElement(Tail, { "data-testid": "numbered-item-tail", $isLast: isLast })),
+        react_1.default.createElement(NumberedItemContent, null,
+            headline &&
+                (0, react_1.createElement)(NumberedItemHeadline, { as: `h${headlineLevel !== null && headlineLevel !== void 0 ? headlineLevel : 3}`, id: headlineTextId }, headline),
+            react_1.default.createElement(NumberedItemBody, null, children))));
+}
+const markerSize = (0, styled_components_1.css) `
+  ${({ $size }) => $size === exports.NumberedListSize.SMALL
+    ? (0, styled_components_1.css) `
+          width: var(--md-numbered-list-marker-small-size);
+          height: var(--md-numbered-list-marker-small-size);
+          --icon-width: var(--md-numbered-list-icon-small-size);
+          --icon-height: var(--md-numbered-list-icon-small-size);
+        `
+    : (0, styled_components_1.css) `
+          width: var(--md-numbered-list-marker-medium-size);
+          height: var(--md-numbered-list-marker-medium-size);
+          --icon-width: var(--md-numbered-list-icon-medium-size);
+          --icon-height: var(--md-numbered-list-icon-medium-size);
+        `}
+`;
+const Marker = styled_components_1.default.span `
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  border-radius: 50%;
+  color: var(--md-numbered-list-marker-text-color);
+  font-size: var(--md-numbered-list-marker-font-size);
+
+  ${({ $type }) => $type === exports.NumberedListType.DOT
+    ? (0, styled_components_1.css) `
+          width: var(--md-numbered-list-dot-size);
+          height: var(--md-numbered-list-dot-size);
+          background-color: var(--text-color-primary);
+        `
+    : (0, styled_components_1.css) `
+          ${markerSize}
+          background-color: var(--md-numbered-list-marker-bg-color);
+        `}
+`;
+const MarkerContent = styled_components_1.default.span `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+`;
+const MarkerLink = styled_components_1.default.span `
+  display: none;
+  align-items: center;
+  justify-content: center;
+
+  svg {
+    width: var(--icon-width, 16px);
+    height: var(--icon-height, 16px);
+  }
+
+  ${({ $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);
+  }
+`;
+const MarkerRail = styled_components_1.default.span `
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  align-self: stretch;
+  flex-shrink: 0;
+
+  a {
+    display: flex;
+    border-radius: 50%;
+    /* Overrides the global markdown link rule a:not([role='button']), which is more specific. */
+    text-decoration: none !important;
+
+    &:hover,
+    &:focus {
+      text-decoration: none !important;
+    }
+  }
+`;
+const Tail = styled_components_1.default.span `
+  flex: 1 0 0;
+  min-height: var(--spacing-xs);
+  width: var(--md-numbered-list-tail-width);
+  background: ${({ $isLast }) => $isLast
+    ? 'var(--md-numbered-list-tail-fade-gradient)'
+    : 'var(--md-numbered-list-tail-bg-color)'};
+`;
+const NumberedItemHeadline = styled_components_1.default.h3 `
+  margin: 0;
+  color: var(--md-numbered-list-headline-text-color);
+  font-size: var(--md-numbered-list-headline-font-size);
+  font-weight: var(--md-numbered-list-headline-font-weight);
+  line-height: var(--md-numbered-list-headline-line-height);
+`;
+const NumberedItemBody = styled_components_1.default.div `
+  display: flex;
+  flex-direction: column;
+  gap: var(--md-numbered-list-body-gap);
+  color: var(--md-numbered-list-body-text-color);
+  font-size: var(--md-numbered-list-body-font-size);
+
+  > p {
+    margin: 0;
+  }
+`;
+const NumberedItemContent = styled_components_1.default.div `
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-unit);
+  flex: 1;
+  min-width: 0;
+  padding-bottom: var(--spacing-sm);
+`;
+const NumberedItemWrapper = styled_components_1.default.li `
+  display: flex;
+  gap: var(--md-numbered-list-gap);
+  align-items: stretch;
+
+  ${({ $isDot }) => $isDot &&
+    (0, styled_components_1.css) `
+      ${MarkerRail} {
+        padding-top: var(--md-numbered-list-dot-rail-padding-top);
+      }
+    `}
+
+  &:last-child ${NumberedItemContent} {
+    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 {
+      display: flex;
+    }
+  }
+`;
+//# sourceMappingURL=NumberedItem.js.map

package/lib/markdoc/components/NumberedList/NumberedList.d.ts

@@ -0,0 +1,5 @@
+import type { JSX, PropsWithChildren } from 'react';
+export type NumberedListProps = PropsWithChildren<{
+    className?: string;
+}>;
+export declare function NumberedList({ className, children }: NumberedListProps): JSX.Element | null;

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

@@ -0,0 +1,28 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NumberedList = NumberedList;
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+function NumberedList({ className, children }) {
+    if (react_1.default.Children.count(children) === 0) {
+        return null;
+    }
+    return (react_1.default.createElement(NumberedListWrapper, { "data-component-name": "Markdoc/NumberedList/NumberedList", className: className }, children));
+}
+const NumberedListWrapper = styled_components_1.default.ol `
+  display: flex;
+  flex-direction: column;
+  margin: var(--md-numbered-list-margin);
+  padding: 0;
+  list-style: none;
+
+  && {
+    & > li:not(:last-child) {
+      margin-bottom: 0;
+    }
+  }
+`;
+//# sourceMappingURL=NumberedList.js.map

package/lib/markdoc/components/NumberedList/variables.d.ts

@@ -0,0 +1 @@
+export declare const markdownNumberedList: import("styled-components").RuleSet<object>;

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

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.markdownNumberedList = void 0;
+const styled_components_1 = require("styled-components");
+exports.markdownNumberedList = (0, styled_components_1.css) `
+  /**
+  *  @tokens Markdown Numbered List
+  */
+
+  --md-numbered-list-margin: var(--spacing-sm) 0; // @presenter Spacing
+  --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
+
+  --md-numbered-list-marker-medium-size: 28px; // @presenter Spacing
+  --md-numbered-list-icon-medium-size: 16px; // @presenter Spacing
+  --md-numbered-list-tail-width: 1px; // @presenter Spacing
+  --md-numbered-list-marker-small-size: 24px; // @presenter Spacing
+  --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-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
+
+  --md-numbered-list-headline-text-color: var(--text-color-primary); // @presenter Color
+  --md-numbered-list-headline-font-size: var(--font-size-base); // @presenter FontSize
+  --md-numbered-list-headline-font-weight: var(--font-weight-medium); // @presenter FontWeight
+  --md-numbered-list-headline-line-height: var(--line-height-base); // @presenter LineHeight
+
+  --md-numbered-list-body-text-color: var(--text-color-secondary); // @presenter Color
+  --md-numbered-list-body-gap: var(--spacing-xs); // @presenter Spacing
+  --md-numbered-list-body-font-size: var(--font-size-base); // @presenter FontSize
+
+  // @tokens End
+`;
+//# sourceMappingURL=variables.js.map

package/lib/markdoc/components/Tabs/Tab.d.ts

@@ -12,5 +12,5 @@ export type TabProps = {
     icon?: React.ReactNode;
     iconRawContent?: string;
 };
-export declare function TabComponent({ tabId, label, size, disabled, setRef, onKeyDown, onClick, icon, iconRawContent }: TabProps): JSX.Element;
+export declare function TabComponent({ tabId, label, size, disabled, setRef, onKeyDown, onClick, icon, iconRawContent, }: TabProps): JSX.Element;
 export declare const Tab: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<TabProps, never> & Partial<Pick<TabProps, never>>> & string & Omit<typeof TabComponent, keyof React.Component<any, {}, any>>;

package/lib/markdoc/components/Tabs/TabList.d.ts

@@ -10,7 +10,7 @@ type TabListProps = {
     containerRef: React.RefObject<HTMLUListElement | null>;
     onReadyChange?: (isReady: boolean) => void;
 };
-export declare function TabList({ childrenArray, size, activeTab, onTabChange, containerRef, onReadyChange }: TabListProps): JSX.Element;
+export declare function TabList({ childrenArray, size, activeTab, onTabChange, containerRef, onReadyChange, }: TabListProps): JSX.Element;
 export declare const TabListContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, never> & Partial<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, never>>> & string;
 export declare const TabItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "active" | "className" | "size" | "tabIndex"> & {
     tabIndex?: number;
@@ -23,10 +23,10 @@ export declare const TabItem: import("styled-components/dist/types").IStyledComp
     active?: boolean;
     size: TabsSize;
 }, never>>> & string;
-export declare const TabButtonLink: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components").FastOmit<import("../../../index.js").ButtonProps, keyof import("../../../index.js").ButtonProps> & import("../../../index.js").ButtonProps, never> & Partial<Pick<import("styled-components").FastOmit<import("../../../index.js").ButtonProps, keyof import("../../../index.js").ButtonProps> & import("../../../index.js").ButtonProps, never>>, "as" | "forwardedAs"> & {
+export declare const TabButtonLink: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components").FastOmit<import("../../../components/Button/Button").ButtonProps, keyof import("../../../components/Button/Button").ButtonProps> & import("../../../components/Button/Button").ButtonProps, never> & Partial<Pick<import("styled-components").FastOmit<import("../../../components/Button/Button").ButtonProps, keyof import("../../../components/Button/Button").ButtonProps> & import("../../../components/Button/Button").ButtonProps, never>>, "as" | "forwardedAs"> & {
     as?: import("styled-components").WebTarget | undefined;
     forwardedAs?: import("styled-components").WebTarget | undefined;
-}, never> & Partial<Pick<import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components").FastOmit<import("../../../index.js").ButtonProps, keyof import("../../../index.js").ButtonProps> & import("../../../index.js").ButtonProps, never> & Partial<Pick<import("styled-components").FastOmit<import("../../../index.js").ButtonProps, keyof import("../../../index.js").ButtonProps> & import("../../../index.js").ButtonProps, never>>, "as" | "forwardedAs"> & {
+}, never> & Partial<Pick<import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components").FastOmit<import("../../../components/Button/Button").ButtonProps, keyof import("../../../components/Button/Button").ButtonProps> & import("../../../components/Button/Button").ButtonProps, never> & Partial<Pick<import("styled-components").FastOmit<import("../../../components/Button/Button").ButtonProps, keyof import("../../../components/Button/Button").ButtonProps> & import("../../../components/Button/Button").ButtonProps, never>>, "as" | "forwardedAs"> & {
     as?: import("styled-components").WebTarget | undefined;
     forwardedAs?: import("styled-components").WebTarget | undefined;
 }, never>>> & string;

package/lib/markdoc/components/Tabs/Tabs.d.ts

@@ -14,5 +14,5 @@ type TabsProps = {
     initialTab?: string;
     activeTab?: string;
 };
-export declare function Tabs({ id, children, className, size, initialTab: propInitialTab, activeTab: controlledActiveTab }: TabsProps): JSX.Element | null;
+export declare function Tabs({ id, children, className, size, initialTab: propInitialTab, activeTab: controlledActiveTab, }: TabsProps): JSX.Element | null;
 export declare const TabContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;

package/lib/markdoc/components/default.d.ts

@@ -8,6 +8,8 @@ export * from '../../markdoc/components/Tabs/TabItemFragment';
 export * from '../../markdoc/components/Tabs/Tab';
 export * from '../../markdoc/components/Tabs/TabList';
 export * from '../../markdoc/components/Tabs/Tabs';
+export * from '../../markdoc/components/NumberedList/NumberedItem';
+export * from '../../markdoc/components/NumberedList/NumberedList';
 export * from '../../markdoc/components/CodeBlock/CodeBlock';
 export * from '../../markdoc/components/Cards/Cards';
 export * from '../../markdoc/components/Cards/Card';

package/lib/markdoc/components/default.js

@@ -24,6 +24,8 @@ __exportStar(require("../../markdoc/components/Tabs/TabItemFragment"), exports);
 __exportStar(require("../../markdoc/components/Tabs/Tab"), exports);
 __exportStar(require("../../markdoc/components/Tabs/TabList"), exports);
 __exportStar(require("../../markdoc/components/Tabs/Tabs"), exports);
+__exportStar(require("../../markdoc/components/NumberedList/NumberedItem"), exports);
+__exportStar(require("../../markdoc/components/NumberedList/NumberedList"), exports);
 __exportStar(require("../../markdoc/components/CodeBlock/CodeBlock"), exports);
 __exportStar(require("../../markdoc/components/Cards/Cards"), exports);
 __exportStar(require("../../markdoc/components/Cards/Card"), exports);

package/lib/markdoc/default.d.ts

@@ -5,6 +5,51 @@ export * from '../markdoc/attributes/img-srcset';
 export * from '../markdoc/attributes/relative-path';
 export * from '../markdoc/attributes/svg-content';
 export * as components from '../markdoc/components/default';
+import { admonition } from '../markdoc/tags/admonition';
+import { html } from '../markdoc/tags/html';
+import { markdocExample } from '../markdoc/tags/markdoc-example';
+import { partial } from '../markdoc/tags/partial';
+import { tab } from '../markdoc/tags/tab';
+import { tabs } from '../markdoc/tags/tabs';
+import { numberedItem } from '../markdoc/tags/numbered-item';
+import { numberedList } from '../markdoc/tags/numbered-list';
+import { debug } from '../markdoc/tags/debug';
+import { codeSnippet } from '../markdoc/tags/code-snippet';
+import { inlineSvg } from '../markdoc/tags/inline-svg';
+import { cards } from '../markdoc/tags/cards';
+import { card } from '../markdoc/tags/card';
+import { img } from '../markdoc/tags/img';
+import { codeWalkthrough } from '../markdoc/tags/code-walkthrough';
+import { codeStep } from '../markdoc/tags/code-step';
+import { input } from '../markdoc/tags/input';
+import { toggle } from '../markdoc/tags/code-toggle';
+import { codeGroup } from '../markdoc/tags/code-group';
+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';
 export declare const tags: {
-    [x: string]: import("./tags/types").MarkdocTagSchema;
+    [admonition.tagName]: import("./tags/types").MarkdocTagSchema;
+    [debug.tagName]: import("./tags/types").MarkdocTagSchema;
+    [html.tagName]: import("./tags/types").MarkdocTagSchema;
+    [markdocExample.tagName]: import("./tags/types").MarkdocTagSchema;
+    [partial.tagName]: import("./tags/types").MarkdocTagSchema;
+    [tab.tagName]: import("./tags/types").MarkdocTagSchema;
+    [tabs.tagName]: import("./tags/types").MarkdocTagSchema;
+    [numberedItem.tagName]: import("./tags/types").MarkdocTagSchema;
+    [numberedList.tagName]: import("./tags/types").MarkdocTagSchema;
+    [codeSnippet.tagName]: import("./tags/types").MarkdocTagSchema;
+    [inlineSvg.tagName]: import("./tags/types").MarkdocTagSchema;
+    [cards.tagName]: import("./tags/types").MarkdocTagSchema;
+    [card.tagName]: import("./tags/types").MarkdocTagSchema;
+    [img.tagName]: import("./tags/types").MarkdocTagSchema;
+    [codeWalkthrough.tagName]: import("./tags/types").MarkdocTagSchema;
+    [codeStep.tagName]: import("./tags/types").MarkdocTagSchema;
+    [toggle.tagName]: import("./tags/types").MarkdocTagSchema;
+    [input.tagName]: import("./tags/types").MarkdocTagSchema;
+    [codeGroup.tagName]: import("./tags/types").MarkdocTagSchema;
+    [icon.tagName]: import("./tags/types").MarkdocTagSchema;
+    [connectMcp.tagName]: import("./tags/types").MarkdocTagSchema;
+    [loginButton.tagName]: import("./tags/types").MarkdocTagSchema;
+    [diagram.tagName]: import("./tags/types").MarkdocTagSchema;
 };

package/lib/markdoc/default.js

@@ -53,6 +53,8 @@ const markdoc_example_1 = require("../markdoc/tags/markdoc-example");
 const partial_1 = require("../markdoc/tags/partial");
 const tab_1 = require("../markdoc/tags/tab");
 const tabs_1 = require("../markdoc/tags/tabs");
+const numbered_item_1 = require("../markdoc/tags/numbered-item");
+const numbered_list_1 = require("../markdoc/tags/numbered-list");
 const debug_1 = require("../markdoc/tags/debug");
 const code_snippet_1 = require("../markdoc/tags/code-snippet");
 const inline_svg_1 = require("../markdoc/tags/inline-svg");
@@ -76,6 +78,8 @@ exports.tags = {
     [partial_1.partial.tagName]: partial_1.partial.schema,
     [tab_1.tab.tagName]: tab_1.tab.schema,
     [tabs_1.tabs.tagName]: tabs_1.tabs.schema,
+    [numbered_item_1.numberedItem.tagName]: numbered_item_1.numberedItem.schema,
+    [numbered_list_1.numberedList.tagName]: numbered_list_1.numberedList.schema,
     [code_snippet_1.codeSnippet.tagName]: code_snippet_1.codeSnippet.schema,
     [inline_svg_1.inlineSvg.tagName]: inline_svg_1.inlineSvg.schema,
     [cards_1.cards.tagName]: cards_1.cards.schema,

package/lib/markdoc/tags/numbered-item.d.ts

@@ -0,0 +1,2 @@
+import type { MarkdocSchemaWrapper } from '../../markdoc/tags/types';
+export declare const numberedItem: MarkdocSchemaWrapper;

package/lib/markdoc/tags/numbered-item.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.numberedItem = void 0;
+const markdoc_1 = __importDefault(require("@markdoc/markdoc"));
+const utils_1 = require("../../core/utils");
+const HEADING_TAG_NAME = /^(Heading|h[1-6])$/;
+exports.numberedItem = {
+    schema: {
+        transform(node, config) {
+            const attributes = node.transformAttributes(config);
+            const children = node.transformChildren(config);
+            const [first, ...body] = children;
+            if ((0, utils_1.isTag)(first) && HEADING_TAG_NAME.test(String(first.name))) {
+                const headlineLevel = typeof first.attributes.level === 'number'
+                    ? first.attributes.level
+                    : Number(String(first.name).slice(1)) || undefined;
+                return new markdoc_1.default.Tag('NumberedItem', Object.assign(Object.assign({}, attributes), { headline: first.children, anchorId: first.attributes.id, headlineLevel }), body);
+            }
+            return new markdoc_1.default.Tag('NumberedItem', attributes, children);
+        },
+        attributes: {
+            icon: { type: String, resolver: 'relativeOrCdnIcon' },
+            iconRawContent: {
+                // internal use only
+                type: String,
+                render: true,
+            },
+        },
+    },
+    tagName: 'numbered-item',
+};
+//# sourceMappingURL=numbered-item.js.map

package/lib/markdoc/tags/numbered-list.d.ts

@@ -0,0 +1,2 @@
+import type { MarkdocSchemaWrapper } from '../../markdoc/tags/types';
+export declare const numberedList: MarkdocSchemaWrapper;

package/lib/markdoc/tags/numbered-list.js

@@ -0,0 +1,28 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.numberedList = void 0;
+const markdoc_1 = __importDefault(require("@markdoc/markdoc"));
+const utils_1 = require("../../core/utils");
+exports.numberedList = {
+    schema: {
+        transform(node, config) {
+            const attributes = node.transformAttributes(config);
+            const items = node
+                .transformChildren(config)
+                .filter((child) => (0, utils_1.isTag)(child) && child.name === 'NumberedItem');
+            items.forEach((item, index) => {
+                item.attributes = Object.assign(Object.assign({}, item.attributes), { type: attributes.type, size: attributes.size, index: index + 1, isLast: index === items.length - 1 });
+            });
+            return new markdoc_1.default.Tag('NumberedList', attributes, items);
+        },
+        attributes: {
+            type: { type: String, matches: ['icon', 'number', 'dot'], default: 'number' },
+            size: { type: String, matches: ['small', 'medium'], default: 'medium' },
+        },
+    },
+    tagName: 'numbered-list',
+};
+//# sourceMappingURL=numbered-list.js.map

package/lib/plugin.d.ts

@@ -1,4 +1,4 @@
-declare const _default: () => {
+export = plugin;
+declare function plugin(): {
     id: string;
 };
-export = _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redocly/theme",
-  "version": "0.68.0-next.0",
+  "version": "0.68.0-next.2",
   "description": "Shared UI components lib",
   "keywords": [
     "theme",
@@ -31,7 +31,7 @@
     "lodash.throttle": "^4.1.1",
     "react": "^19.2.4",
     "react-dom": "^19.2.4",
-    "react-router-dom": "^6.30.3",
+    "react-router-dom": "^7.18.1",
     "styled-components": "^4.1.1 || ^5.3.11 || ^6.0.0"
   },
   "devDependencies": {
@@ -48,10 +48,10 @@
     "@types/nprogress": "0.2.3",
     "@types/react": "^19.2.7",
     "@types/react-dom": "^19.2.3",
-    "@vitest/coverage-v8": "4.1.8",
-    "@vitest/ui": "4.1.8",
+    "@vitest/coverage-v8": "4.1.10",
+    "@vitest/ui": "4.1.10",
     "concurrently": "7.6.0",
-    "react-router-dom": "^6.30.3",
+    "react-router-dom": "^7.18.1",
     "resize-observer-polyfill": "1.5.1",
     "rimraf": "5.0.7",
     "styled-components": "^6.4.2",
@@ -60,7 +60,7 @@
     "tsconfig-paths": "4.2.0",
     "tsconfig-paths-webpack-plugin": "3.5.2",
     "typescript": "6.0.3",
-    "vitest": "4.1.8",
+    "vitest": "4.1.10",
     "vitest-when": "0.6.2",
     "webpack": "5.105.2",
     "@redocly/realm-asyncapi-sdk": "0.14.0-next.0"

package/src/components/Catalog/CatalogEntities.tsx

@@ -3,11 +3,8 @@ import React, { JSX, useEffect } from 'react';
 import type { CatalogEntityConfig } from '@redocly/config';
 
 import { BffCatalogEntity, BffCatalogEntityList } from '@redocly/theme/core/types';
-import {
-  useThemeHooks,
-  useCatalogEntities,
-  useCatalogEntityDetails,
-} from '@redocly/theme/core/hooks';
+import { useThemeHooks, useCatalogEntities } from '@redocly/theme/core/hooks';
+import { getBaseDataAttributes } from '@redocly/theme/core/utils';
 import { ArrowDownIcon } from '@redocly/theme/icons/ArrowDownIcon/ArrowDownIcon';
 import { CatalogCardView } from '@redocly/theme/components/Catalog/CatalogCardView/CatalogCardView';
 import { CatalogTableView } from '@redocly/theme/components/Catalog/CatalogTableView/CatalogTableView';
@@ -45,9 +42,6 @@ export function CatalogEntities(props: CatalogEntitiesProps): JSX.Element {
     isColumnSorted,
   } = props;
 
-  const { getEntityDetailsLink } = useCatalogEntityDetails({
-    catalogConfig,
-  });
   const { useTelemetry, useFetchCatalogEntities } = useThemeHooks();
   const telemetry = useTelemetry();
   const { initialFilter } = useCatalogEntities({
@@ -76,10 +70,12 @@ export function CatalogEntities(props: CatalogEntitiesProps): JSX.Element {
     if (searchQuery) {
       telemetry.sendCatalogEntitiesListSearchResultClickedMessage([
         {
-          id: entity.id,
-          object: 'catalog_entity',
-          uri: getEntityDetailsLink(entity),
+          ...getBaseDataAttributes(
+            'catalogEntitiesListSearchResultId',
+            'catalogEntitiesListSearchResult',
+          ),
           query: searchQuery,
+          entityId: entity.id,
           entityKey: entity.key,
           entityType: entity.type,
         },