mirror of
https://github.com/Redocly/redoc.git
synced 2024-11-22 08:36:33 +03:00
feat: new option expandSingleSchemaField
This commit is contained in:
parent
373f018d0c
commit
7608800d0a
|
@ -230,6 +230,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.
|
* `hideHostname` - if set, the protocol and hostname is not shown in the operation definition.
|
||||||
* `hideLoading` - do not show loading animation. Useful for small docs.
|
* `hideLoading` - do not show loading animation. Useful for small docs.
|
||||||
* `hideSingleRequestSampleTab` - do not show the request sample tab for requests with only one sample.
|
* `hideSingleRequestSampleTab` - do not show the request sample tab for requests with only one sample.
|
||||||
|
* `expandSingleSchemaField` - automatically expand single field in a schema
|
||||||
* `jsonSampleExpandLevel` - set the default expand level for JSON payload samples (responses and request body). Special value 'all' expands all levels. The default value is `2`.
|
* `jsonSampleExpandLevel` - set the default expand level for JSON payload samples (responses and request body). Special value 'all' expands all levels. The default value is `2`.
|
||||||
* `lazyRendering` - _Not implemented yet_ ~~if set, enables lazy rendering mode in ReDoc. This mode is useful for APIs with big number of operations (e.g. > 50). In this mode ReDoc shows initial screen ASAP and then renders the rest operations asynchronously while showing progress bar on the top. Check out the [demo](\\redocly.github.io/redoc) for the example.~~
|
* `lazyRendering` - _Not implemented yet_ ~~if set, enables lazy rendering mode in ReDoc. This mode is useful for APIs with big number of operations (e.g. > 50). In this mode ReDoc shows initial screen ASAP and then renders the rest operations asynchronously while showing progress bar on the top. Check out the [demo](\\redocly.github.io/redoc) for the example.~~
|
||||||
* `menuToggle` - if true clicking second time on expanded menu item will collapse it, default `false`.
|
* `menuToggle` - if true clicking second time on expanded menu item will collapse it, default `false`.
|
||||||
|
|
|
@ -23,6 +23,7 @@ export interface FieldProps extends SchemaOptions {
|
||||||
showExamples?: boolean;
|
showExamples?: boolean;
|
||||||
|
|
||||||
field: FieldModel;
|
field: FieldModel;
|
||||||
|
expandByDefault?: boolean;
|
||||||
|
|
||||||
renderDiscriminatorSwitch?: (opts: FieldProps) => JSX.Element;
|
renderDiscriminatorSwitch?: (opts: FieldProps) => JSX.Element;
|
||||||
}
|
}
|
||||||
|
@ -30,13 +31,19 @@ export interface FieldProps extends SchemaOptions {
|
||||||
@observer
|
@observer
|
||||||
export class Field extends React.Component<FieldProps> {
|
export class Field extends React.Component<FieldProps> {
|
||||||
toggle = () => {
|
toggle = () => {
|
||||||
|
if (this.props.field.expanded === undefined && this.props.expandByDefault) {
|
||||||
|
this.props.field.expanded = false;
|
||||||
|
} else {
|
||||||
this.props.field.toggle();
|
this.props.field.toggle();
|
||||||
|
}
|
||||||
};
|
};
|
||||||
render() {
|
render() {
|
||||||
const { className, field, isLast } = this.props;
|
const { className, field, isLast, expandByDefault } = this.props;
|
||||||
const { name, expanded, deprecated, required, kind } = field;
|
const { name, deprecated, required, kind } = field;
|
||||||
const withSubSchema = !field.schema.isPrimitive && !field.schema.isCircular;
|
const withSubSchema = !field.schema.isPrimitive && !field.schema.isCircular;
|
||||||
|
|
||||||
|
const expanded = field.expanded === undefined ? expandByDefault : field.expanded;
|
||||||
|
|
||||||
const paramName = withSubSchema ? (
|
const paramName = withSubSchema ? (
|
||||||
<ClickablePropertyNameCell
|
<ClickablePropertyNameCell
|
||||||
onClick={this.toggle}
|
onClick={this.toggle}
|
||||||
|
@ -65,7 +72,7 @@ export class Field extends React.Component<FieldProps> {
|
||||||
<FieldDetails {...this.props} />
|
<FieldDetails {...this.props} />
|
||||||
</PropertyDetailsCell>
|
</PropertyDetailsCell>
|
||||||
</tr>
|
</tr>
|
||||||
{field.expanded && withSubSchema && (
|
{expanded && withSubSchema && (
|
||||||
<tr key={field.name + 'inner'}>
|
<tr key={field.name + 'inner'}>
|
||||||
<PropertyCellWithInner colSpan={2}>
|
<PropertyCellWithInner colSpan={2}>
|
||||||
<InnerPropertiesWrap>
|
<InnerPropertiesWrap>
|
||||||
|
|
|
@ -9,6 +9,7 @@ import { DiscriminatorDropdown } from './DiscriminatorDropdown';
|
||||||
import { SchemaProps } from './Schema';
|
import { SchemaProps } from './Schema';
|
||||||
|
|
||||||
import { mapWithLast } from '../../utils';
|
import { mapWithLast } from '../../utils';
|
||||||
|
import { OptionsContext } from '../OptionsProvider';
|
||||||
|
|
||||||
export interface ObjectSchemaProps extends SchemaProps {
|
export interface ObjectSchemaProps extends SchemaProps {
|
||||||
discriminator?: {
|
discriminator?: {
|
||||||
|
@ -19,6 +20,8 @@ export interface ObjectSchemaProps extends SchemaProps {
|
||||||
|
|
||||||
@observer
|
@observer
|
||||||
export class ObjectSchema extends React.Component<ObjectSchemaProps> {
|
export class ObjectSchema extends React.Component<ObjectSchemaProps> {
|
||||||
|
static contextType = OptionsContext;
|
||||||
|
|
||||||
get parentSchema() {
|
get parentSchema() {
|
||||||
return this.props.discriminator!.parentSchema;
|
return this.props.discriminator!.parentSchema;
|
||||||
}
|
}
|
||||||
|
@ -41,6 +44,8 @@ export class ObjectSchema extends React.Component<ObjectSchemaProps> {
|
||||||
})
|
})
|
||||||
: fields;
|
: fields;
|
||||||
|
|
||||||
|
const expandByDefault = this.context.expandSingleSchemaField && filteredFields.length === 1;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<PropertiesTable>
|
<PropertiesTable>
|
||||||
{showTitle && <PropertiesTableCaption>{this.props.schema.title}</PropertiesTableCaption>}
|
{showTitle && <PropertiesTableCaption>{this.props.schema.title}</PropertiesTableCaption>}
|
||||||
|
@ -51,6 +56,7 @@ export class ObjectSchema extends React.Component<ObjectSchemaProps> {
|
||||||
key={field.name}
|
key={field.name}
|
||||||
isLast={isLast}
|
isLast={isLast}
|
||||||
field={field}
|
field={field}
|
||||||
|
expandByDefault={expandByDefault}
|
||||||
renderDiscriminatorSwitch={
|
renderDiscriminatorSwitch={
|
||||||
(discriminator &&
|
(discriminator &&
|
||||||
discriminator.fieldName === field.name &&
|
discriminator.fieldName === field.name &&
|
||||||
|
|
|
@ -26,6 +26,7 @@ export interface RedocRawOptions {
|
||||||
jsonSampleExpandLevel?: number | string | 'all';
|
jsonSampleExpandLevel?: number | string | 'all';
|
||||||
hideSchemaTitles?: boolean | string;
|
hideSchemaTitles?: boolean | string;
|
||||||
payloadSampleIdx?: number;
|
payloadSampleIdx?: number;
|
||||||
|
expandSingleSchemaField?: boolean | string;
|
||||||
|
|
||||||
unstable_ignoreMimeParameters?: boolean;
|
unstable_ignoreMimeParameters?: boolean;
|
||||||
|
|
||||||
|
@ -160,6 +161,7 @@ export class RedocNormalizedOptions {
|
||||||
enumSkipQuotes: boolean;
|
enumSkipQuotes: boolean;
|
||||||
hideSchemaTitles: boolean;
|
hideSchemaTitles: boolean;
|
||||||
payloadSampleIdx: number;
|
payloadSampleIdx: number;
|
||||||
|
expandSingleSchemaField: boolean;
|
||||||
|
|
||||||
/* tslint:disable-next-line */
|
/* tslint:disable-next-line */
|
||||||
unstable_ignoreMimeParameters: boolean;
|
unstable_ignoreMimeParameters: boolean;
|
||||||
|
@ -200,6 +202,7 @@ export class RedocNormalizedOptions {
|
||||||
this.enumSkipQuotes = argValueToBoolean(raw.enumSkipQuotes);
|
this.enumSkipQuotes = argValueToBoolean(raw.enumSkipQuotes);
|
||||||
this.hideSchemaTitles = argValueToBoolean(raw.hideSchemaTitles);
|
this.hideSchemaTitles = argValueToBoolean(raw.hideSchemaTitles);
|
||||||
this.payloadSampleIdx = RedocNormalizedOptions.normalizePayloadSampleIdx(raw.payloadSampleIdx);
|
this.payloadSampleIdx = RedocNormalizedOptions.normalizePayloadSampleIdx(raw.payloadSampleIdx);
|
||||||
|
this.expandSingleSchemaField = argValueToBoolean(raw.expandSingleSchemaField);
|
||||||
|
|
||||||
this.unstable_ignoreMimeParameters = argValueToBoolean(raw.unstable_ignoreMimeParameters);
|
this.unstable_ignoreMimeParameters = argValueToBoolean(raw.unstable_ignoreMimeParameters);
|
||||||
|
|
||||||
|
|
|
@ -30,7 +30,7 @@ function getDefaultStyleValue(parameterLocation: OpenAPIParameterLocation): Open
|
||||||
*/
|
*/
|
||||||
export class FieldModel {
|
export class FieldModel {
|
||||||
@observable
|
@observable
|
||||||
expanded: boolean = false;
|
expanded: boolean | undefined;
|
||||||
|
|
||||||
schema: SchemaModel;
|
schema: SchemaModel;
|
||||||
name: string;
|
name: string;
|
||||||
|
|
Loading…
Reference in New Issue
Block a user