@redocly/theme 0.58.1 → 0.59.0-next.1

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' | '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' | '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.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' | '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/core/utils/index.d.ts

@@ -37,3 +37,4 @@ export * from './lang-to-name';
 export * from './enhanced-smoothstep';
 export * from './icon-resolver';
 export * from './dynamic';
+export * from './tabs';

package/lib/core/utils/index.js

@@ -53,4 +53,5 @@ __exportStar(require("./lang-to-name"), exports);
 __exportStar(require("./enhanced-smoothstep"), exports);
 __exportStar(require("./icon-resolver"), exports);
 __exportStar(require("./dynamic"), exports);
+__exportStar(require("./tabs"), exports);
 //# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+export declare function getTabId(label: string, index: number): string;

package/lib/core/utils/tabs.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getTabId = getTabId;
+function getTabId(label, index) {
+    const cleanLabel = label.replace(/\s+/g, '-').toLowerCase();
+    return `${cleanLabel}-${index}`;
+}
+//# sourceMappingURL=tabs.js.map

package/lib/icons/RedoclyIcon/RedoclyIcon.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { IconProps } from '../../icons/types';
+export declare const RedoclyIcon: 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/RedoclyIcon/RedoclyIcon.js

@@ -0,0 +1,27 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RedoclyIcon = 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({ width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props),
+    react_1.default.createElement("g", { clipPath: "url(#clip0_4053_1165)" },
+        react_1.default.createElement("path", { d: "M14.625 6.19973C14.625 8.69176 12.6173 10.712 10.1406 10.712H2.8125V10.2717C5.04753 10.2717 6.85938 8.44864 6.85938 6.19973C6.85938 3.95082 5.04753 2.12772 2.8125 2.12772V1.6875H10.1406C12.6173 1.6875 14.625 3.70769 14.625 6.19973Z", fill: "#2467F2" }),
+        react_1.default.createElement("path", { d: "M14.625 16.875C14.625 14.383 12.6173 12.3628 10.1406 12.3628H2.8125V12.803C5.04753 12.803 6.85938 14.6261 6.85938 16.875H14.625Z", fill: "#2467F2" })),
+    react_1.default.createElement("defs", null,
+        react_1.default.createElement("clipPath", { id: "clip0_4053_1165" },
+            react_1.default.createElement("rect", { width: "18", height: "18", fill: "white" })))));
+exports.RedoclyIcon = (0, styled_components_1.default)(Icon).attrs(() => ({
+    'data-component-name': 'icons/RedoclyIcon/RedoclyIcon',
+})) `
+  path {
+    fill: ${({ color }) => (0, utils_1.getCssColorVariable)(color)};
+  }
+
+  height: ${({ size }) => size || '16px'};
+  width: ${({ size }) => size || '16px'};
+`;
+//# sourceMappingURL=RedoclyIcon.js.map

package/lib/index.d.ts

@@ -29,6 +29,7 @@ export * from './components/Buttons/CopyButton';
 export * from './components/Buttons/EditPageButton';
 export * from './components/Buttons/EmailButton';
 export * from './components/Buttons/NewTabButton';
+export * from './components/Buttons/AIAssistantButton';
 export * from './components/Markdown/Markdown';
 export * from './components/Markdown/styles/baseTable';
 export * from './components/Markdown/styles/headingAnchor';
@@ -256,6 +257,7 @@ export * from './icons/RabbitMQIcon/RabbitMQIcon';
 export * from './icons/CurveAutoColonIcon/CurveAutoColonIcon';
 export * from './icons/AiStarsIcon/AiStarsIcon';
 export * from './icons/AiStarsGradientIcon/AiStarsGradientIcon';
+export * from './icons/RedoclyIcon/RedoclyIcon';
 export * from './icons/WorkflowHierarchyIcon/WorkflowHierarchyIcon';
 export * from './icons/GenericIcon/GenericIcon';
 export * from './icons/ShareIcon/ShareIcon';

package/lib/index.js

@@ -60,6 +60,7 @@ __exportStar(require("./components/Buttons/CopyButton"), exports);
 __exportStar(require("./components/Buttons/EditPageButton"), exports);
 __exportStar(require("./components/Buttons/EmailButton"), exports);
 __exportStar(require("./components/Buttons/NewTabButton"), exports);
+__exportStar(require("./components/Buttons/AIAssistantButton"), exports);
 /* Markdown */
 __exportStar(require("./components/Markdown/Markdown"), exports);
 __exportStar(require("./components/Markdown/styles/baseTable"), exports);
@@ -309,6 +310,7 @@ __exportStar(require("./icons/RabbitMQIcon/RabbitMQIcon"), exports);
 __exportStar(require("./icons/CurveAutoColonIcon/CurveAutoColonIcon"), exports);
 __exportStar(require("./icons/AiStarsIcon/AiStarsIcon"), exports);
 __exportStar(require("./icons/AiStarsGradientIcon/AiStarsGradientIcon"), exports);
+__exportStar(require("./icons/RedoclyIcon/RedoclyIcon"), exports);
 __exportStar(require("./icons/WorkflowHierarchyIcon/WorkflowHierarchyIcon"), exports);
 __exportStar(require("./icons/GenericIcon/GenericIcon"), exports);
 __exportStar(require("./icons/ShareIcon/ShareIcon"), exports);

package/lib/layouts/RootLayout.js

@@ -8,11 +8,16 @@ const react_1 = __importDefault(require("react"));
 const Navbar_1 = require("../components/Navbar/Navbar");
 const Footer_1 = require("../components/Footer/Footer");
 const SkipContent_1 = require("../components/SkipContent/SkipContent");
+const AIAssistantButton_1 = require("../components/Buttons/AIAssistantButton");
+const hooks_1 = require("../core/hooks");
 function RootLayout({ children }) {
+    const { useSearch } = (0, hooks_1.useThemeHooks)();
+    const { askAi } = useSearch();
     return (react_1.default.createElement("div", { "data-component-name": "layouts/RootLayout" },
         react_1.default.createElement(SkipContent_1.SkipContent, null),
         react_1.default.createElement(Navbar_1.Navbar, null),
         children,
-        react_1.default.createElement(Footer_1.Footer, null)));
+        react_1.default.createElement(Footer_1.Footer, null),
+        askAi && react_1.default.createElement(AIAssistantButton_1.AIAssistantButton, null)));
 }
 //# sourceMappingURL=RootLayout.js.map

package/lib/markdoc/components/Tabs/Tab.js

@@ -11,7 +11,7 @@ const TabList_1 = require("../../../markdoc/components/Tabs/TabList");
 const GenericIcon_1 = require("../../../icons/GenericIcon/GenericIcon");
 function TabComponent({ tabId, label, size, disabled, setRef, onKeyDown, onClick, icon, iconRawContent, }) {
     return (react_1.default.createElement(TabList_1.TabItem, { "data-component-name": "Markdoc/Tabs/Tab", size: size, tabIndex: 0 },
-        react_1.default.createElement(TabList_1.TabButtonLink, { id: `tab-${tabId}`, role: "tab", "aria-selected": "false", "aria-controls": `panel-${tabId}`, tabIndex: -1, size: size, disabled: disabled, ref: setRef, onKeyDown: onKeyDown, onClick: onClick },
+        react_1.default.createElement(TabList_1.TabButtonLink, { id: `tab-${tabId}`, "data-label": label, role: "tab", "aria-selected": "false", "aria-controls": `panel-${tabId}`, tabIndex: -1, size: size, disabled: disabled, ref: setRef, onKeyDown: onKeyDown, onClick: onClick },
             react_1.default.createElement(LabelWrapper, null,
                 react_1.default.createElement(GenericIcon_1.GenericIcon, { icon: icon, rawContent: iconRawContent }),
                 label))));

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

@@ -4,22 +4,10 @@ import { TabItemProps, TabsSize } from '../../../markdoc/components/Tabs/Tabs';
 type TabListProps = {
     childrenArray: React.ReactElement<TabItemProps>[];
     size: TabsSize;
-    overflowTabs: number[];
-    visibleTabs: number[];
-    setTabRef: (element: HTMLButtonElement | null, index: number) => void;
-    onTabClick: (labelOrIndex: string | number) => void;
-    handleKeyboard: (event: React.KeyboardEvent<HTMLButtonElement>, index: number) => void;
-    getTabId: (label: string, index: number) => string;
     activeTab: string;
-    isAnimating: boolean;
-    highlightStyle: {
-        left: number;
-        width: number;
-    };
-    allTabsHidden: boolean;
-    tabsContainerRef: React.RefObject<HTMLUListElement | null>;
+    onTabChange: (tab: string) => void;
 };
-export declare function TabList({ childrenArray, size, overflowTabs, visibleTabs, setTabRef, onTabClick, handleKeyboard, getTabId, activeTab, isAnimating, highlightStyle, allTabsHidden, tabsContainerRef, }: TabListProps): JSX.Element;
+export declare function TabList({ childrenArray, size, activeTab, onTabChange, }: TabListProps): JSX.Element;
 export declare const TabListContainer: import("styled-components").StyledComponent<"ul", any, {}, never>;
 export declare const TabItem: import("styled-components").StyledComponent<"li", any, {
     active?: boolean;

package/lib/markdoc/components/Tabs/TabList.js

@@ -22,35 +22,42 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TabButtonLink = exports.TabItem = exports.TabListContainer = void 0;
 exports.TabList = TabList;
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
 const styled_components_1 = __importStar(require("styled-components"));
 const Tab_1 = require("../../../markdoc/components/Tabs/Tab");
 const Dropdown_1 = require("../../../components/Dropdown/Dropdown");
 const DropdownMenu_1 = require("../../../components/Dropdown/DropdownMenu");
 const DropdownMenuItem_1 = require("../../../components/Dropdown/DropdownMenuItem");
 const Button_1 = require("../../../components/Button/Button");
-function TabList({ childrenArray, size, overflowTabs, visibleTabs, setTabRef, onTabClick, handleKeyboard, getTabId, activeTab, isAnimating, highlightStyle, allTabsHidden, tabsContainerRef, }) {
-    return (react_1.default.createElement(exports.TabListContainer, { role: "tablist", ref: tabsContainerRef, "data-animating": isAnimating },
-        react_1.default.createElement(HighlightBar, { size: size, style: { left: highlightStyle.left, width: highlightStyle.width } },
+const hooks_1 = require("../../../core/hooks");
+const utils_1 = require("../../../core/utils");
+function TabList({ childrenArray, size, activeTab, onTabChange, }) {
+    const tabsContainerRef = (0, react_1.useRef)(null);
+    const { allTabsHidden, overflowTabs, visibleTabs, handleKeyboard, onTabClick, setTabRef } = (0, hooks_1.useTabs)({
+        activeTab,
+        onTabChange,
+        containerRef: tabsContainerRef,
+        totalTabs: childrenArray.length,
+    });
+    const { highlightStyle } = useHighlightBarAnimation({
+        activeTab,
+        childrenArray,
+        overflowTabs,
+        tabsContainerRef,
+        visibleTabs,
+    });
+    return (react_1.default.createElement(exports.TabListContainer, { role: "tablist", ref: tabsContainerRef },
+        react_1.default.createElement(HighlightBar, { size: size, style: highlightStyle },
             react_1.default.createElement("div", null)),
         childrenArray.map((child, index) => {
             if (!visibleTabs.includes(index))
                 return null;
             const { label, icon } = child.props;
-            const tabId = getTabId(label, index);
-            return (react_1.default.createElement(Tab_1.Tab, { key: `key-${tabId}`, tabId: tabId, label: label, icon: icon, size: size, disabled: child.props.disable, setRef: (el) => {
-                    setTabRef(el, index);
-                    if (el) {
-                        el.setAttribute('data-label', label);
-                        el.setAttribute('data-animating', isAnimating.toString());
-                    }
-                }, onKeyDown: (event) => handleKeyboard(event, index), onClick: () => {
+            const tabId = (0, utils_1.getTabId)(label, index);
+            return (react_1.default.createElement(Tab_1.Tab, { key: `key-${tabId}`, tabId: tabId, label: label, icon: icon, size: size, disabled: child.props.disable, setRef: (el) => setTabRef(el, index), onKeyDown: (event) => handleKeyboard(event, index), onClick: () => {
                     var _a, _b;
                     (_b = (_a = child.props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a);
                     onTabClick(label);
@@ -61,7 +68,7 @@ function TabList({ childrenArray, size, overflowTabs, visibleTabs, setTabRef, on
                     : undefined }, allTabsHidden ? activeTab : 'More'), alignment: "start", withArrow: true },
             react_1.default.createElement(DropdownMenu_1.DropdownMenu, null, overflowTabs.map((index) => {
                 const { label } = childrenArray[index].props;
-                const tabId = getTabId(label, index);
+                const tabId = (0, utils_1.getTabId)(label, index);
                 return (react_1.default.createElement(DropdownMenuItem_1.DropdownMenuItem, { key: `more-${tabId}`, active: activeTab === label, onAction: () => {
                         var _a, _b;
                         (_b = (_a = childrenArray[index].props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a);
@@ -69,6 +76,46 @@ function TabList({ childrenArray, size, overflowTabs, visibleTabs, setTabRef, on
                     }, disabled: childrenArray[index].props.disable }, label));
             })))))));
 }
+const useHighlightBarAnimation = (props) => {
+    const { childrenArray, activeTab, tabsContainerRef, visibleTabs, overflowTabs } = props;
+    const [highlightStyle, setHighlightStyle] = react_1.default.useState({
+        left: 0,
+        width: 0,
+    });
+    (0, react_1.useEffect)(() => {
+        const activeIndex = childrenArray.findIndex((child) => child.props.label === activeTab);
+        const container = tabsContainerRef.current;
+        if (!container || activeIndex === -1) {
+            setHighlightStyle({ left: 0, width: 0 });
+            return;
+        }
+        const activeTabElement = container.querySelector(`[data-label="${activeTab}"]`);
+        if (!activeTabElement)
+            return;
+        container.querySelectorAll('[data-label]').forEach((el) => {
+            el.classList.remove('active');
+        });
+        const { offsetLeft, offsetWidth } = activeTabElement;
+        if (visibleTabs.includes(activeIndex)) {
+            activeTabElement.classList.add('active');
+            setHighlightStyle({ left: offsetLeft, width: offsetWidth });
+            return;
+        }
+        if (overflowTabs.includes(activeIndex)) {
+            const moreButton = container.querySelector('button');
+            if (!moreButton)
+                return;
+            const moreButtonRect = moreButton.getBoundingClientRect();
+            const containerRect = container.getBoundingClientRect();
+            setHighlightStyle({
+                left: moreButtonRect.left - containerRect.left,
+                width: moreButtonRect.width,
+            });
+            return;
+        }
+    }, [activeTab, childrenArray, visibleTabs, overflowTabs, tabsContainerRef]);
+    return { highlightStyle };
+};
 exports.TabListContainer = styled_components_1.default.ul `
   position: relative;
   display: flex;

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

@@ -12,12 +12,12 @@ export type TabItemProps = {
     icon?: React.ReactNode | string;
 };
 type TabsProps = {
+    id?: string;
     children: React.ReactElement<TabItemProps>[];
     className?: string;
     size: TabsSize;
-    forceReady?: boolean;
     initialTab?: string;
 };
-export declare function Tabs({ children, className, size, forceReady, initialTab: propInitialTab, }: TabsProps): JSX.Element;
+export declare function Tabs({ id, children, className, size, initialTab: propInitialTab, }: TabsProps): JSX.Element;
 export declare const TabContent: import("styled-components").StyledComponent<"div", any, {}, never>;
 export {};

package/lib/markdoc/components/Tabs/Tabs.js

@@ -22,101 +22,35 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TabContent = exports.TabsSize = void 0;
 exports.Tabs = Tabs;
 const react_1 = __importStar(require("react"));
-const styled_components_1 = __importStar(require("styled-components"));
+const styled_components_1 = __importDefault(require("styled-components"));
 const hooks_1 = require("../../../core/hooks");
 const TabList_1 = require("../../../markdoc/components/Tabs/TabList");
+const utils_1 = require("../../../core/utils");
 var TabsSize;
 (function (TabsSize) {
     TabsSize["SMALL"] = "small";
     TabsSize["MEDIUM"] = "medium";
 })(TabsSize || (exports.TabsSize = TabsSize = {}));
-function Tabs({ children, className, size, forceReady = false, initialTab: propInitialTab, }) {
+function Tabs({ id, children, className, size, initialTab: propInitialTab, }) {
     var _a, _b;
     const [childrenArray, setChildrenArray] = (0, react_1.useState)(react_1.default.Children.toArray(children));
+    const initialTab = (_b = propInitialTab !== null && propInitialTab !== void 0 ? propInitialTab : (_a = childrenArray[0]) === null || _a === void 0 ? void 0 : _a.props.label) !== null && _b !== void 0 ? _b : '';
+    const { activeTab, setActiveTab } = (0, hooks_1.useActiveTab)({ tabsId: id, initialTab });
     (0, react_1.useEffect)(() => {
         setChildrenArray(react_1.default.Children.toArray(children));
     }, [children]);
-    const tabsContainerRef = (0, react_1.useRef)(null);
-    const [isAnimating, setIsAnimating] = (0, react_1.useState)(false);
-    const defaultInitialTab = (_b = (_a = childrenArray[0]) === null || _a === void 0 ? void 0 : _a.props.label) !== null && _b !== void 0 ? _b : '';
-    const initialTab = propInitialTab !== null && propInitialTab !== void 0 ? propInitialTab : defaultInitialTab;
-    const { activeTab, setTabRef, onTabClick, handleKeyboard, getTabId, visibleTabs, overflowTabs, ready, allTabsHidden, } = (0, hooks_1.useTabs)({
-        initialTab,
-        totalTabs: childrenArray.length,
-        containerRef: tabsContainerRef,
-    });
-    const [prevTab, setPrevTab] = react_1.default.useState(initialTab);
-    const [highlightStyle, setHighlightStyle] = react_1.default.useState({
-        left: 0,
-        width: 0,
-    });
-    (0, react_1.useEffect)(() => {
-        setPrevTab(activeTab);
-        setIsAnimating(true);
-        const activeIndex = childrenArray.findIndex((child) => child.props.label === activeTab);
-        const container = tabsContainerRef.current;
-        if (container) {
-            container.querySelectorAll('[data-label]').forEach((el) => {
-                el.classList.remove('active');
-            });
-            container.getBoundingClientRect();
-            requestAnimationFrame(() => {
-                if (activeIndex >= 0) {
-                    let activeTabElement = null;
-                    let startPosition = { left: 0, width: 0 };
-                    if (visibleTabs.includes(activeIndex)) {
-                        activeTabElement = container.querySelector(`[data-label="${activeTab}"]`);
-                    }
-                    else if (overflowTabs.includes(activeIndex)) {
-                        const moreButton = container.querySelector('button');
-                        if (moreButton) {
-                            const moreButtonRect = moreButton.getBoundingClientRect();
-                            const containerRect = container.getBoundingClientRect();
-                            startPosition = {
-                                left: moreButtonRect.left - containerRect.left,
-                                width: moreButtonRect.width,
-                            };
-                        }
-                    }
-                    if (activeTabElement) {
-                        const { offsetLeft, offsetWidth } = activeTabElement;
-                        if (overflowTabs.includes(activeIndex)) {
-                            setHighlightStyle(startPosition);
-                            requestAnimationFrame(() => {
-                                setHighlightStyle({ left: offsetLeft, width: offsetWidth });
-                            });
-                        }
-                        else {
-                            setHighlightStyle({ left: offsetLeft, width: offsetWidth });
-                        }
-                        if (visibleTabs.includes(activeIndex)) {
-                            activeTabElement === null || activeTabElement === void 0 ? void 0 : activeTabElement.classList.add('active');
-                        }
-                        return () => {
-                            container.querySelectorAll('[data-label]').forEach((el) => {
-                                el.classList.remove('active');
-                            });
-                        };
-                    }
-                }
-                setHighlightStyle({ left: 0, width: 0 });
-                setIsAnimating(false);
-            });
-        }
-        else {
-            setHighlightStyle({ left: 0, width: 0 });
-            setIsAnimating(false);
-        }
-    }, [activeTab, prevTab, childrenArray, visibleTabs, overflowTabs]);
-    return (react_1.default.createElement(TabsContainer, { "data-component-name": "Markdoc/Tabs/Tabs", className: className, isReady: ready || forceReady },
-        react_1.default.createElement(TabList_1.TabList, { size: size, childrenArray: childrenArray, overflowTabs: overflowTabs, setTabRef: setTabRef, onTabClick: onTabClick, handleKeyboard: handleKeyboard, getTabId: getTabId, activeTab: activeTab, isAnimating: isAnimating, highlightStyle: highlightStyle, visibleTabs: visibleTabs, allTabsHidden: allTabsHidden, tabsContainerRef: tabsContainerRef }),
+    return (react_1.default.createElement(TabsContainer, { "data-component-name": "Markdoc/Tabs/Tabs", className: className, key: id },
+        react_1.default.createElement(TabList_1.TabList, { size: size, childrenArray: childrenArray, activeTab: activeTab, onTabChange: setActiveTab }),
         childrenArray.map((child, index) => {
             const { label } = child.props;
-            const tabId = getTabId(label, index);
+            const tabId = (0, utils_1.getTabId)(label, index);
             return label === activeTab ? (react_1.default.createElement(exports.TabContent, { key: `content-${tabId}`, id: `panel-${tabId}`, "aria-labelledby": `tab-${tabId}`, tabIndex: 0, role: "tabpanel" }, child.props.children)) : null;
         })));
 }
@@ -132,16 +66,6 @@ const TabsContainer = styled_components_1.default.div `
   padding: var(--md-tabs-container-padding);
   border: var(--md-tabs-container-border);
 
-  ${({ isReady }) => !isReady
-    ? (0, styled_components_1.css) `
-          visibility: hidden;
-          overflow: hidden;
-        `
-    : (0, styled_components_1.css) `
-          visibility: visible;
-          overflow: visible;
-        `}
-
   ol[class^='Tabs__TabList'] {
     margin: 0;
     padding: 0;

package/lib/markdoc/tags/tabs.js

@@ -22,6 +22,11 @@ exports.tabs = {
             return new markdoc_1.default.Tag('Tabs', attributes, tabsContent);
         },
         attributes: {
+            /*
+              A unique persistent identifier assigned to a component.
+              This value is used as a key for the query parameter that stores the active tab to enable deep linking.
+            */
+            id: { type: String },
             size: { type: String, matches: ['small', 'medium'], default: 'medium' },
         },
     },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redocly/theme",
-  "version": "0.58.1",
+  "version": "0.59.0-next.1",
   "description": "Shared UI components lib",
   "keywords": [
     "theme",
@@ -88,7 +88,7 @@
     "react-calendar": "5.1.0",
     "react-date-picker": "11.0.0",
     "@redocly/config": "0.35.1",
-    "@redocly/realm-asyncapi-sdk": "0.4.1"
+    "@redocly/realm-asyncapi-sdk": "0.5.0-next.0"
   },
   "scripts": {
     "watch": "tsc -p tsconfig.build.json && (concurrently \"tsc -w -p tsconfig.build.json\" \"tsc-alias -w -p tsconfig.build.json\")",

package/src/components/Accordion/Accordion.tsx

@@ -0,0 +1,100 @@
+import React, { useEffect, useState } from 'react';
+import styled from 'styled-components';
+
+import type { BaseSyntheticEvent, PropsWithChildren, ReactNode, JSX } from 'react';
+import type { AccordionHeaderProps } from '@redocly/theme/components/Accordion/AccordionHeader';
+
+import { AccordionBody } from '@redocly/theme/components/Accordion/AccordionBody';
+import { AccordionHeader } from '@redocly/theme/components/Accordion/AccordionHeader';
+import { AccordionTitle } from '@redocly/theme/components/Accordion/AccordionTitle';
+import { ChevronDownIcon } from '@redocly/theme/icons/ChevronDownIcon/ChevronDownIcon';
+import { ChevronRightIcon } from '@redocly/theme/icons/ChevronRightIcon/ChevronRightIcon';
+
+export type AccordionProps = {
+  expanded?: boolean;
+  isExpandable?: boolean;
+  className?: string;
+  renderChildrenHidden?: boolean;
+  header?: ReactNode | ((props: AccordionHeaderProps) => ReactNode);
+  onToggle?: (expanded: boolean) => void;
+  dataTestId?: string;
+};
+
+export function Accordion({
+  expanded = true,
+  isExpandable = true,
+  renderChildrenHidden = false,
+  header,
+  className,
+  children,
+  onToggle,
+  dataTestId,
+}: PropsWithChildren<AccordionProps>): JSX.Element {
+  const [isExpanded, setExpanded] = useState(expanded);
+  const [animate, setAnimate] = useState(false);
+
+  const toggle = ({ target }: BaseSyntheticEvent): void => {
+    if (target instanceof HTMLAnchorElement || !isExpandable) return;
+    setAnimate(true);
+    setExpanded(!isExpanded);
+    onToggle?.(!isExpanded);
+  };
+
+  useEffect(() => setExpanded(expanded), [expanded]);
+
+  return (
+    <AccordionWrapper
+      className={className}
+      data-testid={dataTestId}
+      data-component-name="Accordion/Accordion"
+    >
+      {header &&
+        (typeof header === 'function' ? (
+          header({ expanded: isExpanded })
+        ) : (
+          <AccordionHeader
+            data-testid="accordion-header"
+            onClick={toggle}
+            expanded={isExpanded}
+            isExpandable={isExpandable}
+          >
+            <HeaderContent>
+              <AccordionTitle data-testid="title">{header}</AccordionTitle>
+              {isExpandable &&
+                (isExpanded ? (
+                  <ChevronDownIcon color="--accordion-chevron-icon-color" />
+                ) : (
+                  <ChevronRightIcon color="--accordion-chevron-icon-color" />
+                ))}
+            </HeaderContent>
+          </AccordionHeader>
+        ))}
+
+      {(isExpanded || renderChildrenHidden) && (
+        <AccordionBody data-testid="accordion-body" hidden={!isExpanded} animate={animate}>
+          {children}
+        </AccordionBody>
+      )}
+    </AccordionWrapper>
+  );
+}
+
+const AccordionWrapper = styled.div`
+  background-color: transparent;
+  font-family: var(--accordion-font-family);
+  font-size: var(--accordion-font-size);
+  font-weight: var(--accordion-font-weight);
+  border-radius: var(--accordion-border-radius);
+  border: var(--accordion-border);
+
+  &:not(:last-child) {
+    margin-bottom: var(--accordion-gap);
+  }
+`;
+
+const HeaderContent = styled.div`
+  display: flex;
+  align-items: center;
+  width: 100%;
+  gap: var(--spacing-xs);
+`;