Redocly/redoc
1
1
Fork 0
mirror of https://github.com/Redocly/redoc.git synced 2025-03-03 17:35:46 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix: add id attr to headers to work before react is loaded if ssr

Browse Source
This commit is contained in:
Roman Hotsiy 2018-01-10 18:23:14 +02:00
parent 7eb477b9de
commit 174345399f
No known key found for this signature in database
GPG Key ID: 5CB7B3ACABA57CB0
4 changed files with 9 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/ContentItems/ContentItems.tsx
View File

@ -59,11 +59,12 @@ export class ContentItem extends React.Component<ContentItemProps> {
export class TagItem extends React.Component<ContentItemProps> { export class TagItem extends React.Component<ContentItemProps> {
render() { render() {
const { name, description } = this.props.item; const { name, description } = this.props.item;
const hash = this.props.item.getHash();
return ( return (
<Row> <Row>
<MiddlePanel key="middle"> <MiddlePanel key="middle">
<H1> <H1 id={hash}>
<ShareLink href={'#' + this.props.item.getHash()} /> <ShareLink href={'#' + hash} />
{name} {name}
</H1> </H1>
{description !== undefined && <Markdown source={description} />} {description !== undefined && <Markdown source={description} />}

6
src/components/Operation/Operation.tsx
View File

@ -44,12 +44,12 @@ export class Operation extends ComponentWithOptions<OperationProps> {
const { name: summary, description, deprecated } = operation; const { name: summary, description, deprecated } = operation;
const pathInMiddle = this.options.pathInMiddlePanel; const pathInMiddle = this.options.pathInMiddlePanel;
const hash = operation.getHash();
return ( return (
<OperationRow> <OperationRow>
<MiddlePanel> <MiddlePanel>
<H2> <H2 id={hash}>
<ShareLink href={'#' + operation.getHash()} /> <ShareLink href={'#' + hash} />
{summary} {deprecated && <Badge type="warning"> Deprecated </Badge>} {summary} {deprecated && <Badge type="warning"> Deprecated </Badge>}
</H2> </H2>
{pathInMiddle && <Endpoint operation={operation} inverted={true} />} {pathInMiddle && <Endpoint operation={operation} inverted={true} />}

2
src/components/SecuritySchemes/SecuritySchemes.tsx
View File

@ -82,7 +82,7 @@ export class SecurityDefs extends React.PureComponent<SecurityDefsProps> {
<div> <div>
{this.props.securitySchemes.schemes.map(scheme => ( {this.props.securitySchemes.schemes.map(scheme => (
<div data-section-id={scheme.sectionId} key={scheme.id}> <div data-section-id={scheme.sectionId} key={scheme.id}>
<H2> <H2 id={scheme.sectionId}>
<ShareLink href={'#' + scheme.sectionId} /> <ShareLink href={'#' + scheme.sectionId} />
{scheme.id} {scheme.id}
</H2> </H2>

4
src/services/MarkdownRenderer.ts
View File

@ -90,14 +90,14 @@ export class MarkdownRenderer {
let id = this.currentTopHeading.id; let id = this.currentTopHeading.id;
return ( return (
`<a name="${id}"></a>` + `<a name="${id}"></a>` +
`<h${tokens[idx].hLevel} ${SECTION_ATTR}="${id}">` + `<h${tokens[idx].hLevel} ${SECTION_ATTR}="${id}" id="${id}">` +
`<a class="share-link" href="#${id}"></a>` `<a class="share-link" href="#${id}"></a>`
); );
} else if (tokens[idx].hLevel === 2) { } else if (tokens[idx].hLevel === 2) {
let { id } = this.saveHeading(content, this.currentTopHeading.items); let { id } = this.saveHeading(content, this.currentTopHeading.items);
return ( return (
`<a name="${id}"></a>` + `<a name="${id}"></a>` +
`<h${tokens[idx].hLevel} ${SECTION_ATTR}="${id}">` + `<h${tokens[idx].hLevel} ${SECTION_ATTR}="${id}" id="${id}">` +
`<a class="share-link" href="#${id}"></a>` `<a class="share-link" href="#${id}"></a>`
); );
} }