add the option to render vendor extensions

README.md

@@ -215,6 +215,7 @@ You can use all of the following options with standalone version on <redoc> tag
 * `hideHostname` - if set, the protocol and hostname is not shown in the operation definition.
 * `expandResponses` - specify which responses to expand by default by response codes. Values should be passed as comma-separated list without spaces e.g. `expandResponses="200,201"`. Special value `"all"` expands all responses by default. Be careful: this option can slow-down documentation rendering time.
 * `requiredPropsFirst` - show required properties first ordered in the same order as in `required` array.
+* `showExtensions` - show vendor extensions ("x-" fields). Extensions used by ReDoc are ignored.
 * `noAutoAuth` - do not inject Authentication section automatically
 * `pathInMiddlePanel` - show path link and HTTP verb in the middle panel instead of the right one
 * `hideLoading` - do not show loading animation. Useful for small docs

src/components/Fields/Extensions.tsx

@@ -0,0 +1,46 @@
+import * as React from 'react';
+
+import { OptionsContext } from '../OptionsProvider';
+
+import { SchemaModel } from '../../services/models';
+import { FieldDetail } from './FieldDetail';
+
+export interface ExtensionsProps {
+  schema: SchemaModel;
+}
+
+export class Extensions extends React.PureComponent<ExtensionsProps> {
+  redocExtensions = [
+    'x-circular-ref',
+    'x-code-samples',
+    'x-displayName',
+    'x-examples',
+    'x-ignoredHeaderParameters',
+    'x-logo',
+    'x-nullable',
+    'x-servers',
+    'x-tagGroups',
+    'x-traitTag',
+  ];
+
+  render() {
+    const { schema } = this.props;
+    const fullSchema = schema.schema;
+    const extensionList = Object.keys(fullSchema).filter(
+      key => key.startsWith('x-') && !this.redocExtensions.includes(key),
+    );
+
+    return (
+      <OptionsContext.Consumer>
+        {options => (
+          <>
+            {options.showExtensions &&
+              extensionList.map(key => (
+                <FieldDetail key={key} label={key} value={fullSchema[key]} />
+              ))}
+          </>
+        )}
+      </OptionsContext.Consumer>
+    );
+  }
+}

src/components/Fields/FieldDetails.tsx

@@ -12,6 +12,7 @@ import {
 import { ExternalDocumentation } from '../ExternalDocumentation/ExternalDocumentation';
 import { Markdown } from '../Markdown/Markdown';
 import { EnumValues } from './EnumValues';
+import { Extensions } from './Extensions';
 import { FieldProps } from './Field';
 import { ConstraintsView } from './FieldContstraints';
 import { FieldDetail } from './FieldDetail';
@@ -51,6 +52,7 @@ export class FieldDetails extends React.PureComponent<FieldProps> {
         <FieldDetail label={'Default:'} value={schema.default} />
         {!renderDiscriminatorSwitch && <EnumValues type={schema.type} values={schema.enum} />}{' '}
         {showExamples && <FieldDetail label={'Example:'} value={example} />}
+        {<Extensions schema={schema} />}
         <div>
           <Markdown compact={true} source={description} />
         </div>

src/services/RedocNormalizedOptions.ts

@@ -17,6 +17,7 @@ export interface RedocRawOptions {
   hideLoading?: boolean | string;
   hideDownloadButton?: boolean | string;
   disableSearch?: boolean | string;
+  showExtensions?: boolean | string;
 
   unstable_ignoreMimeParameters?: boolean;
 
@@ -99,6 +100,7 @@ export class RedocNormalizedOptions {
   untrustedSpec: boolean;
   hideDownloadButton: boolean;
   disableSearch: boolean;
+  showExtensions: boolean;
 
   /* tslint:disable-next-line */
   unstable_ignoreMimeParameters: boolean;
@@ -124,6 +126,7 @@ export class RedocNormalizedOptions {
     this.untrustedSpec = argValueToBoolean(raw.untrustedSpec);
     this.hideDownloadButton = argValueToBoolean(raw.hideDownloadButton);
     this.disableSearch = argValueToBoolean(raw.disableSearch);
+    this.showExtensions = argValueToBoolean(raw.showExtensions);
 
     this.unstable_ignoreMimeParameters = argValueToBoolean(raw.unstable_ignoreMimeParameters);