@redocly/theme 0.59.0-next.4 → 0.59.0-next.6

package/lib/components/Buttons/variables.js

@@ -23,7 +23,7 @@ exports.aiAssistantButton = (0, styled_components_1.css) `
   /* Positioning */
   --ai-assistant-button-bottom: var(--spacing-xl);
   --ai-assistant-button-right: var(--spacing-xl);
-  --ai-assistant-button-z-index: 1000;
+  --ai-assistant-button-z-index: 50
 
   /* Typography */
   --ai-assistant-button-font-size: var(--font-size-base);

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

@@ -25,6 +25,7 @@ const InfoBarWrapper = styled_components_1.default.div `
   transition: all 0.2s ease-in-out;
   height: 100%;
   padding: var(--catalog-card-gap);
+  margin-bottom: var(--spacing-xs);
 
   ${({ hoverEffect }) => hoverEffect &&
     `

package/lib/components/Catalog/CatalogEntityIcon.js

@@ -14,6 +14,7 @@ const HierarchyIcon_1 = require("../../icons/HierarchyIcon/HierarchyIcon");
 const Image_1 = require("../../components/Image/Image");
 const core_1 = require("../../core");
 const NoteIcon_1 = require("../../icons/NoteIcon/NoteIcon");
+const CubeIcon_1 = require("../../icons/CubeIcon/CubeIcon");
 const getIconColor = (entityType) => `var(--catalog-entity-icon-color-${entityType})`;
 const getEntityIcon = ({ entityType, defaultColor, forceColor, entitiesCatalogConfig, }) => {
     var _a, _b;
@@ -34,7 +35,7 @@ const getEntityIcon = ({ entityType, defaultColor, forceColor, entitiesCatalogCo
     if ((iconConfig === null || iconConfig === void 0 ? void 0 : iconConfig.src) || (iconConfig === null || iconConfig === void 0 ? void 0 : iconConfig.srcSet)) {
         return (react_1.default.createElement(Image_1.Image, { src: iconConfig === null || iconConfig === void 0 ? void 0 : iconConfig.src, srcSet: iconConfig === null || iconConfig === void 0 ? void 0 : iconConfig.srcSet, alt: `${entityType} icon`, width: "16", height: "16" }));
     }
-    return react_1.default.createElement(CodeIcon_1.CodeIcon, { color: "var(--catalog-entity-icon-color)" }); // @TODO: add default icon
+    return react_1.default.createElement(CubeIcon_1.CubeIcon, { color: "var(--catalog-entity-icon-color)" });
 };
 function CatalogEntityIcon({ entityType, defaultColor = false, forceColor, }) {
     const themeConfig = (0, core_1.useThemeConfig)();

package/lib/components/Catalog/variables.js

@@ -99,7 +99,7 @@ exports.catalog = (0, styled_components_1.css) `
   /**
     * @tokens Catalog entity icon
     */
-  --catalog-entity-icon-color: var(--color-primary-base);
+  --catalog-entity-icon-color: var(--color-persian-green-8);
   --catalog-entity-border-color: var(--border-color-secondary);
   --catalog-entity-bg-color: var(--bg-color-tonal);
 

package/lib/components/Search/SearchDialog.js

@@ -75,6 +75,16 @@ function SearchDialog({ onClose, className, initialMode = 'search', }) {
     const aiSearch = useAiSearch({ filter }, searchSessionId);
     const searchInputRef = (0, react_1.useRef)(null);
     const modalRef = (0, react_1.useRef)(null);
+    const [isMobile, setIsMobile] = (0, react_1.useState)(false);
+    (0, react_1.useEffect)(() => {
+        const mediaQuery = window.matchMedia(`(max-width: ${utils_1.breakpoints.small})`);
+        setIsMobile(mediaQuery.matches);
+        const handleChange = (e) => {
+            setIsMobile(e.matches);
+        };
+        mediaQuery.addEventListener('change', handleChange);
+        return () => mediaQuery.removeEventListener('change', handleChange);
+    }, []);
     const aiQueryRef = (0, react_1.useRef)(null);
     const firstSearchResultRef = (0, react_1.useRef)(null);
     const searchKeysWithResults = items ? Object.keys(items).filter((key) => { var _a; return (_a = items[key]) === null || _a === void 0 ? void 0 : _a.length; }) : [];
@@ -185,8 +195,12 @@ function SearchDialog({ onClose, className, initialMode = 'search', }) {
                             setMode('search');
                             aiSearch.clearConversation();
                             focusSearchInput();
-                        }, tabIndex: 0, icon: react_1.default.createElement(ChevronLeftIcon_1.ChevronLeftIcon, null) }, translate('search.ai.backToSearch', 'Back to search')),
-                    react_1.default.createElement(Button_1.Button, { variant: "secondary", disabled: !aiSearch.conversation.length, onClick: () => aiSearch.clearConversation(), tabIndex: 0, icon: react_1.default.createElement(EditIcon_1.EditIcon, null) }, translate('search.ai.newConversation', 'New conversation'))))),
+                        }, tabIndex: 0, icon: react_1.default.createElement(ChevronLeftIcon_1.ChevronLeftIcon, null) }, isMobile
+                        ? translate('search.ai.back', 'Back')
+                        : translate('search.ai.backToSearch', 'Back to search')),
+                    react_1.default.createElement(AiDialogHeaderActionsWrapper, null,
+                        react_1.default.createElement(Button_1.Button, { variant: "secondary", disabled: !aiSearch.conversation.length, onClick: () => aiSearch.clearConversation(), tabIndex: 0, icon: react_1.default.createElement(EditIcon_1.EditIcon, null) }, translate('search.ai.newConversation', 'New conversation')),
+                        isMobile && react_1.default.createElement(Button_1.Button, { variant: "text", icon: react_1.default.createElement(CloseIcon_1.CloseIcon, null), onClick: handleClose }))))),
             react_1.default.createElement(SearchDialogBody, null, mode === 'search' ? (react_1.default.createElement(react_1.default.Fragment, null,
                 advancedSearch && isFilterOpen && (react_1.default.createElement(SearchDialogBodyFilterView, null,
                     react_1.default.createElement(SearchFilter_1.SearchFilter, { facets: facets, filter: filter, query: query, quickFilterFields: [groupField], onFilterChange: onFilterChange, onFilterReset: onFilterReset, onFacetReset: onFacetReset }))),
@@ -321,6 +335,10 @@ const AiDialogHeaderWrapper = styled_components_1.default.div `
   align-items: center;
   width: 100%;
 `;
+const AiDialogHeaderActionsWrapper = styled_components_1.default.div `
+  display: flex;
+  gap: var(--spacing-xxs);
+`;
 const SearchDialogBody = styled_components_1.default.div `
   display: flex;
   flex-direction: row-reverse;
@@ -422,6 +440,7 @@ const AiDisclaimer = styled_components_1.default.div `
   line-height: var(--search-ai-disclaimer-line-height);
   color: var(--search-ai-disclaimer-text-color);
   margin: 0 auto;
+  text-align: center;
 `;
 const SearchWithAI = styled_components_1.default.div `
   display: flex;

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

@@ -43,14 +43,14 @@ export declare const useTelemetryFallback: () => {
     sendRedirectMessage: () => void;
     sendOpenapiDocsMessage: () => void;
     sendCopyCodeSnippetClickedMessage: () => void;
-    sendOpenapiDocsViewedMessage: () => void;
-    sendOpenapiDocsPerformanceMetricsMessage: () => void;
-    sendOpenapiDocsDownloadDefinitionClickedMessage: () => void;
-    sendOpenapiDocsSelectLanguageClickedMessage: () => void;
-    sendOpenapiDocsExpandCollapseAllClickedMessage: () => void;
-    sendOpenapiDocsSwitchServersClickedMessage: () => void;
-    sendOpenapiDocsExamplesSwitcherClickedMessage: () => void;
-    sendOpenapiDocsTryItOpenedMessage: () => void;
+    sendViewedMessage: () => void;
+    sendPerformanceMetricsMessage: () => void;
+    sendDownloadDefinitionClickedMessage: () => void;
+    sendSelectLanguageClickedMessage: () => void;
+    sendExpandCollapseAllClickedMessage: () => void;
+    sendSwitchServersClickedMessage: () => void;
+    sendExamplesSwitcherClickedMessage: () => void;
+    sendTryItOpenedMessage: () => void;
     sendAsyncapiDocsViewedMessage: () => void;
     sendAsyncapiDocsPerformanceMetricsMessage: () => void;
     sendAsyncapiDocsSwitchMessageClickedMessage: () => void;

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

@@ -47,14 +47,14 @@ const useTelemetryFallback = () => ({
     sendRedirectMessage: () => { },
     sendOpenapiDocsMessage: () => { },
     sendCopyCodeSnippetClickedMessage: () => { },
-    sendOpenapiDocsViewedMessage: () => { },
-    sendOpenapiDocsPerformanceMetricsMessage: () => { },
-    sendOpenapiDocsDownloadDefinitionClickedMessage: () => { },
-    sendOpenapiDocsSelectLanguageClickedMessage: () => { },
-    sendOpenapiDocsExpandCollapseAllClickedMessage: () => { },
-    sendOpenapiDocsSwitchServersClickedMessage: () => { },
-    sendOpenapiDocsExamplesSwitcherClickedMessage: () => { },
-    sendOpenapiDocsTryItOpenedMessage: () => { },
+    sendViewedMessage: () => { },
+    sendPerformanceMetricsMessage: () => { },
+    sendDownloadDefinitionClickedMessage: () => { },
+    sendSelectLanguageClickedMessage: () => { },
+    sendExpandCollapseAllClickedMessage: () => { },
+    sendSwitchServersClickedMessage: () => { },
+    sendExamplesSwitcherClickedMessage: () => { },
+    sendTryItOpenedMessage: () => { },
     sendAsyncapiDocsViewedMessage: () => { },
     sendAsyncapiDocsPerformanceMetricsMessage: () => { },
     sendAsyncapiDocsSwitchMessageClickedMessage: () => { },

package/lib/core/styles/dark.js

@@ -37,6 +37,10 @@ const replayDarkMode = (0, styled_components_1.css) `
   --replay-server-variable-bg-color-hover: rgba(31, 10, 144, 0.4); // @presenter Color
   --replay-path-parameter-bg-color-hover: rgba(5, 88, 99, 0.4); // @presenter Color
 
+  --replay-runtime-expression-color:  rgba(147, 166, 249, 1); // @presenter Color
+  --replay-runtime-expression-bg-color: rgba(147, 166, 249, 0.16); // @presenter Color
+  --replay-operators-color: rgba(168, 143, 88, 1); // @presenter Color
+
   // @tokens End
 `;
 exports.darkMode = (0, styled_components_1.css) `

package/lib/core/styles/global.js

@@ -1203,6 +1203,10 @@ const replay = (0, styled_components_1.css) `
   --replay-server-variable-bg-color-hover: rgba(119, 45, 240, 0.16); // @presenter Color
   --replay-path-parameter-bg-color-hover: rgba(4, 117, 161, 0.16); // @presenter Color
 
+  --replay-runtime-expression-color: rgba(54, 90, 249, 1); // @presenter Color
+  --replay-runtime-expression-bg-color: rgba(54, 90, 249, 0.08); // @presenter Color
+  --replay-operators-color: rgba(193, 142, 31, 1); // @presenter Color
+
   // @tokens End
 `;
 exports.styles = (0, styled_components_1.css) `

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.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.filter.title' | 'search.filter.reset' | 'search.filter.field.reset' | 'search.ai.welcomeText' | 'search.ai.newConversation' | 'search.ai.backToSearch' | 'search.ai.placeholder' | 'search.ai.generatingResponse' | 'search.ai.followUpQuestion' | 'search.ai.suggestionsTitle' | 'search.ai.thinkingText' | 'search.ai.resourcesFound' | 'search.ai.resourcesFound.basedOn' | 'search.ai.resourcesFound.resources' | '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' | 'aiAssistant.trigger' | 'toc.header' | 'footer.copyrightText' | 'page.homeButton' | 'page.forbidden.title' | 'page.notFound.title' | 'page.notFound.description' | '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' | '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.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' | 'userMenu.login' | 'userMenu.logout' | 'userMenu.devOnboardingLabel' | 'mobileMenu.mainMenu' | 'mobileMenu.previous' | 'mobileMenu.products' | 'mobileMenu.version' | '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' | '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' | '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.servers.title' | 'openapi.operations' | 'openapi.webhooks' | 'openapi.description' | 'openapi.badges.deprecated' | 'openapi.badges.required' | 'openapi.badges.webhook' | 'openapi.request' | 'openapi.path' | 'openapi.query' | '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.hideExample' | 'openapi.showExample' | 'openapi.expandAll' | 'openapi.collapseAll' | 'openapi.viewSecurityDetails' | 'openapi.noResponseExample' | 'openapi.discriminator.searchPlaceholder' | 'openapi.discriminator.searchNoResults' | 'openapi.noResponseContent' | 'openapi.noRequestPayload' | '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' | 'asyncapi.download.description.title' | 'asyncapi.info.title' | 'graphql.queries' | 'graphql.mutations' | 'graphql.subscriptions' | 'graphql.directives' | 'graphql.objects' | 'graphql.interfaces' | 'graphql.unions' | 'graphql.enums' | 'graphql.inputs' | 'graphql.scalars' | '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.nonNull' | 'graphql.required' | 'graphql.deprecated' | 'graphql.variables' | 'graphql.querySample' | 'graphql.mutationSample' | 'graphql.subscriptionSample' | 'graphql.responseSample' | 'graphql.locations' | 'graphql.sample' | 'graphql.referenced' | 'graphql.content.fragment' | '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';
+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.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.filter.title' | 'search.filter.reset' | 'search.filter.field.reset' | 'search.ai.welcomeText' | 'search.ai.newConversation' | 'search.ai.backToSearch' | 'search.ai.back' | 'search.ai.placeholder' | 'search.ai.generatingResponse' | 'search.ai.followUpQuestion' | 'search.ai.suggestionsTitle' | 'search.ai.thinkingText' | 'search.ai.resourcesFound' | 'search.ai.resourcesFound.basedOn' | 'search.ai.resourcesFound.resources' | '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' | 'aiAssistant.trigger' | 'toc.header' | 'footer.copyrightText' | 'page.homeButton' | 'page.forbidden.title' | 'page.notFound.title' | 'page.notFound.description' | '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' | '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.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' | 'userMenu.login' | 'userMenu.logout' | 'userMenu.devOnboardingLabel' | 'mobileMenu.mainMenu' | 'mobileMenu.previous' | 'mobileMenu.products' | 'mobileMenu.version' | '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' | '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' | '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.servers.title' | 'openapi.operations' | 'openapi.webhooks' | 'openapi.description' | 'openapi.badges.deprecated' | 'openapi.badges.required' | 'openapi.badges.webhook' | 'openapi.request' | 'openapi.path' | 'openapi.query' | '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.hideExample' | 'openapi.showExample' | 'openapi.expandAll' | 'openapi.collapseAll' | 'openapi.viewSecurityDetails' | 'openapi.noResponseExample' | 'openapi.discriminator.searchPlaceholder' | 'openapi.discriminator.searchNoResults' | 'openapi.noResponseContent' | 'openapi.noRequestPayload' | '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' | 'asyncapi.download.description.title' | 'asyncapi.info.title' | 'graphql.queries' | 'graphql.mutations' | 'graphql.subscriptions' | 'graphql.directives' | 'graphql.objects' | 'graphql.interfaces' | 'graphql.unions' | 'graphql.enums' | 'graphql.inputs' | 'graphql.scalars' | '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.nonNull' | 'graphql.required' | 'graphql.deprecated' | 'graphql.variables' | 'graphql.querySample' | 'graphql.mutationSample' | 'graphql.subscriptionSample' | 'graphql.responseSample' | 'graphql.locations' | 'graphql.sample' | 'graphql.referenced' | 'graphql.content.fragment' | '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';
 export type Locale = {
     code: string;
     name: string;

package/lib/icons/CubeIcon/CubeIcon.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { IconProps } from '../../icons/types';
+export declare const CubeIcon: import("styled-components").StyledComponent<(props: IconProps) => React.JSX.Element, any, {
+    'data-component-name': string;
+} & {
+    color?: string;
+    size?: string;
+    className?: string;
+} & React.SVGProps<SVGSVGElement>, "data-component-name">;

package/lib/icons/CubeIcon/CubeIcon.js

@@ -0,0 +1,17 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CubeIcon = void 0;
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const Icon = (props) => (react_1.default.createElement("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor" }, props),
+    react_1.default.createElement("path", { d: "M14.252 4.06812L8.25195 0.568119C8.17548 0.523507 8.08853 0.5 8 0.5C7.91147 0.5 7.82452 0.523507 7.74805 0.568119L1.74805 4.06812C1.67257 4.11215 1.60994 4.1752 1.56642 4.25099C1.5229 4.32677 1.5 4.41263 1.5 4.50002V11.5C1.5 11.5874 1.5229 11.6733 1.56642 11.7491C1.60994 11.8248 1.67257 11.8879 1.74805 11.9319L7.74805 15.4319C7.82452 15.4765 7.91147 15.5 8 15.5C8.08853 15.5 8.17548 15.4765 8.25195 15.4319L14.252 11.9319C14.3274 11.8879 14.3901 11.8248 14.4336 11.7491C14.4771 11.6733 14.5 11.5874 14.5 11.5V4.50002C14.5 4.41263 14.4771 4.32677 14.4336 4.25099C14.3901 4.1752 14.3274 4.11215 14.252 4.06812ZM8 1.57887L13.0078 4.50002L8 7.42117L2.9922 4.50002L8 1.57887ZM2.5 5.37062L7.5 8.28712V14.1294L2.5 11.2129V5.37062ZM8.5 14.1294V8.28712L13.5 5.37062V11.2129L8.5 14.1294Z", fill: "currentColor" })));
+exports.CubeIcon = (0, styled_components_1.default)(Icon).attrs(() => ({
+    'data-component-name': 'icons/CubeIcon/CubeIcon',
+})) `
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;
+//# sourceMappingURL=CubeIcon.js.map

package/lib/icons/HashtagIcon/HashtagIcon.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { IconProps } from '../../icons/types';
+export declare const HashtagIcon: import("styled-components").StyledComponent<(props: IconProps) => React.JSX.Element, any, {
+    'data-component-name': string;
+} & {
+    color?: string;
+    size?: string;
+    className?: string;
+} & React.SVGProps<SVGSVGElement>, "data-component-name">;

package/lib/icons/HashtagIcon/HashtagIcon.js

@@ -0,0 +1,22 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.HashtagIcon = 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 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props),
+    react_1.default.createElement("path", { d: "M10.5 4.5V3.75H8.25V1.5H7.5V3.75H4.5V1.5H3.75V3.75H1.5V4.5H3.75V7.5H1.5V8.25H3.75V10.5H4.5V8.25H7.5V10.5H8.25V8.25H10.5V7.5H8.25V4.5H10.5ZM7.5 7.5H4.5V4.5H7.5V7.5Z" })));
+exports.HashtagIcon = (0, styled_components_1.default)(Icon).attrs(() => ({
+    'data-component-name': 'icons/HashtagIcon/HashtagIcon',
+})) `
+  path {
+    fill: ${({ color }) => (0, utils_1.getCssColorVariable)(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;
+//# sourceMappingURL=HashtagIcon.js.map

package/lib/index.d.ts

@@ -261,6 +261,7 @@ export * from './icons/RedoclyIcon/RedoclyIcon';
 export * from './icons/WorkflowHierarchyIcon/WorkflowHierarchyIcon';
 export * from './icons/GenericIcon/GenericIcon';
 export * from './icons/ShareIcon/ShareIcon';
+export * from './icons/HashtagIcon/HashtagIcon';
 export * from './layouts/RootLayout';
 export * from './layouts/PageLayout';
 export * from './layouts/NotFound';

package/lib/index.js

@@ -324,6 +324,7 @@ __exportStar(require("./icons/RedoclyIcon/RedoclyIcon"), exports);
 __exportStar(require("./icons/WorkflowHierarchyIcon/WorkflowHierarchyIcon"), exports);
 __exportStar(require("./icons/GenericIcon/GenericIcon"), exports);
 __exportStar(require("./icons/ShareIcon/ShareIcon"), exports);
+__exportStar(require("./icons/HashtagIcon/HashtagIcon"), exports);
 /* Layouts */
 __exportStar(require("./layouts/RootLayout"), exports);
 __exportStar(require("./layouts/PageLayout"), exports);

package/lib/markdoc/components/Cards/Card.js

@@ -43,6 +43,7 @@ const ContentWrapper = styled_components_1.default.div `
   flex-direction: column;
   flex-shrink: 1;
   gap: var(--card-content-gap);
+  width: 100%;
 `;
 const Title = styled_components_1.default.h3 `
   margin: var(--card-title-margin);
@@ -82,28 +83,6 @@ const Body = styled_components_1.default.div `
   > *:last-child {
     margin-bottom: 0;
   }
-
-  /* Icon link styles */
-  & a {
-    display: inline-flex;
-    align-items: center;
-    line-height: 1;
-
-    & svg {
-      width: 1.2em;
-      height: 1.2em;
-      margin-right: 0.25em;
-      vertical-align: middle;
-
-      & g {
-        fill: var(--link-color-primary);
-      }
-    }
-  }
-
-  & a:visited > span > svg > g {
-    fill: var(--link-color-visited);
-  }
 `;
 const CardWrapper = styled_components_1.default.div.attrs(({ $isCardLink, $variant }) => ({
     className: getCardWrapperClass($isCardLink, $variant),
@@ -149,12 +128,6 @@ const CardWrapper = styled_components_1.default.div.attrs(({ $isCardLink, $varia
       }
     }
   }
-
-  && ul {
-    list-style: none;
-    padding-left: 0;
-    margin: var(--spacing-xs) 0;
-  }
 `;
 const getCardWrapperClass = ($isCardLink, $variant) => {
     let classes = [];

package/lib/markdoc/tags/card.js

@@ -54,7 +54,6 @@ exports.card = {
             },
             to: { type: String, resolver: 'link' },
         },
-        children: ['paragraph', 'tag', 'list'],
     },
     tagName: 'card',
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redocly/theme",
-  "version": "0.59.0-next.4",
+  "version": "0.59.0-next.6",
   "description": "Shared UI components lib",
   "keywords": [
     "theme",
@@ -87,8 +87,8 @@
     "openapi-sampler": "1.6.2",
     "react-calendar": "5.1.0",
     "react-date-picker": "11.0.0",
-    "@redocly/config": "0.36.0",
-    "@redocly/realm-asyncapi-sdk": "0.5.0-next.1"
+    "@redocly/config": "0.36.1",
+    "@redocly/realm-asyncapi-sdk": "0.5.0-next.2"
   },
   "scripts": {
     "watch": "tsc -p tsconfig.build.json && (concurrently \"tsc -w -p tsconfig.build.json\" \"tsc-alias -w -p tsconfig.build.json\")",

package/src/components/Buttons/variables.ts

@@ -21,7 +21,7 @@ export const aiAssistantButton = css`
   /* Positioning */
   --ai-assistant-button-bottom: var(--spacing-xl);
   --ai-assistant-button-right: var(--spacing-xl);
-  --ai-assistant-button-z-index: 1000;
+  --ai-assistant-button-z-index: 50
 
   /* Typography */
   --ai-assistant-button-font-size: var(--font-size-base);

package/src/components/Catalog/CatalogEntity/CatalogEntityInfoBar.tsx

@@ -41,6 +41,7 @@ const InfoBarWrapper = styled.div<{ hoverEffect: boolean }>`
   transition: all 0.2s ease-in-out;
   height: 100%;
   padding: var(--catalog-card-gap);
+  margin-bottom: var(--spacing-xs);
 
   ${({ hoverEffect }) =>
     hoverEffect &&

package/src/components/Catalog/CatalogEntityIcon.tsx

@@ -11,6 +11,7 @@ import { HierarchyIcon } from '@redocly/theme/icons/HierarchyIcon/HierarchyIcon'
 import { Image } from '@redocly/theme/components/Image/Image';
 import { PREDEFINED_ENTITY_TYPES, useThemeConfig } from '@redocly/theme/core';
 import { NoteIcon } from '@redocly/theme/icons/NoteIcon/NoteIcon';
+import { CubeIcon } from '@redocly/theme/icons/CubeIcon/CubeIcon';
 
 export type CatalogEntityIconProps = {
   entityType: string;
@@ -59,7 +60,7 @@ const getEntityIcon = ({
     );
   }
 
-  return <CodeIcon color="var(--catalog-entity-icon-color)" />; // @TODO: add default icon
+  return <CubeIcon color="var(--catalog-entity-icon-color)" />;
 };
 
 export function CatalogEntityIcon({

package/src/components/Catalog/variables.ts

@@ -97,7 +97,7 @@ export const catalog = css`
   /**
     * @tokens Catalog entity icon
     */
-  --catalog-entity-icon-color: var(--color-primary-base);
+  --catalog-entity-icon-color: var(--color-persian-green-8);
   --catalog-entity-border-color: var(--border-color-secondary);
   --catalog-entity-bg-color: var(--bg-color-tonal);
 

package/src/components/Search/SearchDialog.tsx

@@ -77,6 +77,20 @@ export function SearchDialog({
 
   const searchInputRef = useRef<HTMLInputElement>(null);
   const modalRef = useRef<HTMLDivElement>(null);
+
+  const [isMobile, setIsMobile] = useState(false);
+
+  useEffect(() => {
+    const mediaQuery = window.matchMedia(`(max-width: ${breakpoints.small})`);
+    setIsMobile(mediaQuery.matches);
+
+    const handleChange = (e: MediaQueryListEvent) => {
+      setIsMobile(e.matches);
+    };
+    mediaQuery.addEventListener('change', handleChange);
+    return () => mediaQuery.removeEventListener('change', handleChange);
+  }, []);
+
   const aiQueryRef = useRef<HTMLDivElement>(null);
   const firstSearchResultRef = useRef<HTMLAnchorElement>(null);
   const searchKeysWithResults = items ? Object.keys(items).filter((key) => items[key]?.length) : [];
@@ -254,17 +268,22 @@ export function SearchDialog({
                 tabIndex={0}
                 icon={<ChevronLeftIcon />}
               >
-                {translate('search.ai.backToSearch', 'Back to search')}
-              </Button>
-              <Button
-                variant="secondary"
-                disabled={!aiSearch.conversation.length}
-                onClick={() => aiSearch.clearConversation()}
-                tabIndex={0}
-                icon={<EditIcon />}
-              >
-                {translate('search.ai.newConversation', 'New conversation')}
+                {isMobile
+                  ? translate('search.ai.back', 'Back')
+                  : translate('search.ai.backToSearch', 'Back to search')}
               </Button>
+              <AiDialogHeaderActionsWrapper>
+                <Button
+                  variant="secondary"
+                  disabled={!aiSearch.conversation.length}
+                  onClick={() => aiSearch.clearConversation()}
+                  tabIndex={0}
+                  icon={<EditIcon />}
+                >
+                  {translate('search.ai.newConversation', 'New conversation')}
+                </Button>
+                {isMobile && <Button variant="text" icon={<CloseIcon />} onClick={handleClose} />}
+              </AiDialogHeaderActionsWrapper>
             </AiDialogHeaderWrapper>
           )}
         </SearchDialogHeader>
@@ -536,6 +555,10 @@ const AiDialogHeaderWrapper = styled.div`
   align-items: center;
   width: 100%;
 `;
+const AiDialogHeaderActionsWrapper = styled.div`
+  display: flex;
+  gap: var(--spacing-xxs);
+`;
 
 const SearchDialogBody = styled.div`
   display: flex;
@@ -652,6 +675,7 @@ const AiDisclaimer = styled.div`
   line-height: var(--search-ai-disclaimer-line-height);
   color: var(--search-ai-disclaimer-text-color);
   margin: 0 auto;
+  text-align: center;
 `;
 
 const SearchWithAI = styled.div`

package/src/core/hooks/use-telemetry-fallback.ts

@@ -44,14 +44,14 @@ export const useTelemetryFallback = () => ({
   sendRedirectMessage: () => {},
   sendOpenapiDocsMessage: () => {},
   sendCopyCodeSnippetClickedMessage: () => {},
-  sendOpenapiDocsViewedMessage: () => {},
-  sendOpenapiDocsPerformanceMetricsMessage: () => {},
-  sendOpenapiDocsDownloadDefinitionClickedMessage: () => {},
-  sendOpenapiDocsSelectLanguageClickedMessage: () => {},
-  sendOpenapiDocsExpandCollapseAllClickedMessage: () => {},
-  sendOpenapiDocsSwitchServersClickedMessage: () => {},
-  sendOpenapiDocsExamplesSwitcherClickedMessage: () => {},
-  sendOpenapiDocsTryItOpenedMessage: () => {},
+  sendViewedMessage: () => {},
+  sendPerformanceMetricsMessage: () => {},
+  sendDownloadDefinitionClickedMessage: () => {},
+  sendSelectLanguageClickedMessage: () => {},
+  sendExpandCollapseAllClickedMessage: () => {},
+  sendSwitchServersClickedMessage: () => {},
+  sendExamplesSwitcherClickedMessage: () => {},
+  sendTryItOpenedMessage: () => {},
   sendAsyncapiDocsViewedMessage: () => {},
   sendAsyncapiDocsPerformanceMetricsMessage: () => {},
   sendAsyncapiDocsSwitchMessageClickedMessage: () => {},

package/src/core/styles/dark.ts

@@ -36,6 +36,10 @@ const replayDarkMode = css`
   --replay-server-variable-bg-color-hover: rgba(31, 10, 144, 0.4); // @presenter Color
   --replay-path-parameter-bg-color-hover: rgba(5, 88, 99, 0.4); // @presenter Color
 
+  --replay-runtime-expression-color:  rgba(147, 166, 249, 1); // @presenter Color
+  --replay-runtime-expression-bg-color: rgba(147, 166, 249, 0.16); // @presenter Color
+  --replay-operators-color: rgba(168, 143, 88, 1); // @presenter Color
+
   // @tokens End
 `;
 

package/src/core/styles/global.ts

@@ -1224,6 +1224,10 @@ const replay = css`
   --replay-server-variable-bg-color-hover: rgba(119, 45, 240, 0.16); // @presenter Color
   --replay-path-parameter-bg-color-hover: rgba(4, 117, 161, 0.16); // @presenter Color
 
+  --replay-runtime-expression-color: rgba(54, 90, 249, 1); // @presenter Color
+  --replay-runtime-expression-bg-color: rgba(54, 90, 249, 0.08); // @presenter Color
+  --replay-operators-color: rgba(193, 142, 31, 1); // @presenter Color
+
   // @tokens End
 `;
 

package/src/core/types/l10n.ts

@@ -86,6 +86,7 @@ export type TranslationKey =
   | 'search.ai.welcomeText'
   | 'search.ai.newConversation'
   | 'search.ai.backToSearch'
+  | 'search.ai.back'
   | 'search.ai.placeholder'
   | 'search.ai.generatingResponse'
   | 'search.ai.followUpQuestion'

package/src/icons/CubeIcon/CubeIcon.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+import styled from 'styled-components';
+
+import type { IconProps } from '@redocly/theme/icons/types';
+
+const Icon = (props: IconProps) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="16"
+    height="16"
+    viewBox="0 0 16 16"
+    fill="currentColor"
+    {...props}
+  >
+    <path
+      d="M14.252 4.06812L8.25195 0.568119C8.17548 0.523507 8.08853 0.5 8 0.5C7.91147 0.5 7.82452 0.523507 7.74805 0.568119L1.74805 4.06812C1.67257 4.11215 1.60994 4.1752 1.56642 4.25099C1.5229 4.32677 1.5 4.41263 1.5 4.50002V11.5C1.5 11.5874 1.5229 11.6733 1.56642 11.7491C1.60994 11.8248 1.67257 11.8879 1.74805 11.9319L7.74805 15.4319C7.82452 15.4765 7.91147 15.5 8 15.5C8.08853 15.5 8.17548 15.4765 8.25195 15.4319L14.252 11.9319C14.3274 11.8879 14.3901 11.8248 14.4336 11.7491C14.4771 11.6733 14.5 11.5874 14.5 11.5V4.50002C14.5 4.41263 14.4771 4.32677 14.4336 4.25099C14.3901 4.1752 14.3274 4.11215 14.252 4.06812ZM8 1.57887L13.0078 4.50002L8 7.42117L2.9922 4.50002L8 1.57887ZM2.5 5.37062L7.5 8.28712V14.1294L2.5 11.2129V5.37062ZM8.5 14.1294V8.28712L13.5 5.37062V11.2129L8.5 14.1294Z"
+      fill="currentColor"
+    />
+  </svg>
+);
+
+export const CubeIcon = styled(Icon).attrs(() => ({
+  'data-component-name': 'icons/CubeIcon/CubeIcon',
+}))<IconProps>`
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/icons/HashtagIcon/HashtagIcon.tsx

@@ -0,0 +1,23 @@
+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 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+    <path d="M10.5 4.5V3.75H8.25V1.5H7.5V3.75H4.5V1.5H3.75V3.75H1.5V4.5H3.75V7.5H1.5V8.25H3.75V10.5H4.5V8.25H7.5V10.5H8.25V8.25H10.5V7.5H8.25V4.5H10.5ZM7.5 7.5H4.5V4.5H7.5V7.5Z" />
+  </svg>
+);
+
+export const HashtagIcon = styled(Icon).attrs(() => ({
+  'data-component-name': 'icons/HashtagIcon/HashtagIcon',
+}))<IconProps>`
+  path {
+    fill: ${({ color }) => getCssColorVariable(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;

package/src/index.ts

@@ -287,6 +287,7 @@ export * from '@redocly/theme/icons/RedoclyIcon/RedoclyIcon';
 export * from '@redocly/theme/icons/WorkflowHierarchyIcon/WorkflowHierarchyIcon';
 export * from '@redocly/theme/icons/GenericIcon/GenericIcon';
 export * from '@redocly/theme/icons/ShareIcon/ShareIcon';
+export * from '@redocly/theme/icons/HashtagIcon/HashtagIcon';
 /* Layouts */
 export * from '@redocly/theme/layouts/RootLayout';
 export * from '@redocly/theme/layouts/PageLayout';

package/src/markdoc/components/Cards/Card.tsx

@@ -103,6 +103,7 @@ const ContentWrapper = styled.div`
   flex-direction: column;
   flex-shrink: 1;
   gap: var(--card-content-gap);
+  width: 100%;
 `;
 
 const Title = styled.h3<{ $isCardLink: boolean; $justifyContent: string }>`
@@ -146,28 +147,6 @@ const Body = styled.div<{ $lineClamp?: number }>`
   > *:last-child {
     margin-bottom: 0;
   }
-
-  /* Icon link styles */
-  & a {
-    display: inline-flex;
-    align-items: center;
-    line-height: 1;
-
-    & svg {
-      width: 1.2em;
-      height: 1.2em;
-      margin-right: 0.25em;
-      vertical-align: middle;
-
-      & g {
-        fill: var(--link-color-primary);
-      }
-    }
-  }
-
-  & a:visited > span > svg > g {
-    fill: var(--link-color-visited);
-  }
 `;
 
 const CardWrapper = styled.div.attrs<{
@@ -222,12 +201,6 @@ const CardWrapper = styled.div.attrs<{
       }
     }
   }
-
-  && ul {
-    list-style: none;
-    padding-left: 0;
-    margin: var(--spacing-xs) 0;
-  }
 `;
 
 const getCardWrapperClass = ($isCardLink: boolean, $variant?: string) => {

package/src/markdoc/tags/card.ts

@@ -54,7 +54,6 @@ export const card: MarkdocSchemaWrapper = {
       },
       to: { type: String, resolver: 'link' },
     },
-    children: ['paragraph', 'tag', 'list'],
   },
   tagName: 'card',
 };