mirror of
https://github.com/GitbookIO/gitbook.git
synced 2026-09-12 05:48:57 +00:00
Fix OpenAPI long tab group description (#2838)
This commit is contained in:
@@ -0,0 +1,6 @@
|
||||
---
|
||||
'@gitbook/react-openapi': patch
|
||||
'gitbook': patch
|
||||
---
|
||||
|
||||
Fix long tab group description
|
||||
@@ -338,7 +338,7 @@
|
||||
}
|
||||
|
||||
.openapi-response-description.openapi-markdown {
|
||||
@apply prose-sm text-[0.813rem] h-auto relative leading-[1.125rem] text-tint !font-normal truncate select-text prose-strong:font-semibold prose-strong:text-inherit;
|
||||
@apply text-left prose-sm text-[0.813rem] h-auto relative leading-[1.125rem] text-tint !font-normal truncate select-text prose-strong:font-semibold prose-strong:text-inherit;
|
||||
}
|
||||
|
||||
.openapi-response-description.openapi-markdown::-webkit-scrollbar {
|
||||
@@ -525,11 +525,11 @@
|
||||
}
|
||||
|
||||
.openapi-disclosure-group-header {
|
||||
@apply flex flex-row items-center justify-between gap-3;
|
||||
@apply flex flex-row items-baseline justify-between gap-3 relative;
|
||||
}
|
||||
|
||||
.openapi-disclosure-group-trigger {
|
||||
@apply flex items-center relative flex-1 gap-2.5 py-2 truncate -outline-offset-1;
|
||||
@apply flex items-baseline relative flex-1 gap-2.5 py-2 truncate -outline-offset-1;
|
||||
}
|
||||
|
||||
.openapi-disclosure-group-trigger:disabled {
|
||||
@@ -545,6 +545,10 @@
|
||||
@apply invisible;
|
||||
}
|
||||
|
||||
.openapi-disclosure-group-trigger[aria-expanded='true'] .openapi-response-description {
|
||||
@apply whitespace-normal;
|
||||
}
|
||||
|
||||
.openapi-disclosure-group-icon > svg {
|
||||
@apply size-3 text-tint-subtle transition-all duration-300;
|
||||
}
|
||||
@@ -561,17 +565,16 @@
|
||||
@apply rotate-90;
|
||||
}
|
||||
|
||||
.openapi-disclosure-group:hover .openapi-disclosure-group-mediatype,
|
||||
.openapi-disclosure-group[aria-expanded='true'] .openapi-disclosure-group-mediatype {
|
||||
.openapi-disclosure-group:hover .openapi-disclosure-group-mediatype {
|
||||
@apply opacity-11 flex;
|
||||
}
|
||||
|
||||
.openapi-disclosure-group-mediatype {
|
||||
@apply opacity-0 hidden transition-all duration-200 shrink-0;
|
||||
@apply opacity-0 hidden text-xs transition-all duration-200 shrink-0 absolute right-0 top-2.5;
|
||||
}
|
||||
|
||||
.openapi-disclosure-group-mediatype > span {
|
||||
@apply text-xs text-tint-subtle;
|
||||
@apply px-1 bg-tint-6 text-tint-12 rounded-full;
|
||||
}
|
||||
|
||||
/* Disclosure */
|
||||
|
||||
@@ -4,7 +4,6 @@ import { OpenAPIResponse } from './OpenAPIResponse';
|
||||
import { OpenAPIClientContext } from './types';
|
||||
import { InteractiveSection } from './InteractiveSection';
|
||||
import { OpenAPIDisclosureGroup } from './OpenAPIDisclosureGroup';
|
||||
import { Markdown } from './Markdown';
|
||||
|
||||
/**
|
||||
* Display an interactive response body.
|
||||
@@ -40,10 +39,9 @@ export function OpenAPIResponses(props: {
|
||||
{statusCode}
|
||||
</span>
|
||||
{description ? (
|
||||
<Markdown
|
||||
source={description}
|
||||
className="openapi-response-description"
|
||||
/>
|
||||
<div className="openapi-markdown openapi-response-description">
|
||||
{htmlToText(description)}
|
||||
</div>
|
||||
) : null}
|
||||
</div>
|
||||
),
|
||||
@@ -66,3 +64,8 @@ export function OpenAPIResponses(props: {
|
||||
</InteractiveSection>
|
||||
);
|
||||
}
|
||||
|
||||
function htmlToText(html: string): string {
|
||||
const doc = new DOMParser().parseFromString(html, 'text/html');
|
||||
return doc.body.textContent?.trim() || '';
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user