Merge branch 'main' into feat/queryparamnavigation

2025-07-29 17:40:05 +03:00 · 2023-04-25 16:05:55 +01:00 · 2023-04-25 16:05:55 +01:00 · 92c56f1c21
commit 92c56f1c21
parent 63731f9dd7 c26e3473a4
16 changed files with 187 additions and 1416 deletions
--- a/README.md
+++ b/README.md
@ -84,7 +84,7 @@ Refer to the Redocly's documentation for more information on these products:
 - [Simple integration with `create-react-app`](https://redocly.com/docs/redoc/quickstart/react/)

  [Example repo](https://github.com/APIs-guru/create-react-app-redoc)
- [Command-line interface to bundle your docs into a **zero-dependency** HTML file](https://redoc.ly/docs/redoc/quickstart/cli/)
+- [Command-line interface to bundle your docs into a **zero-dependency** HTML file](https://redocly.com/docs/cli/commands/build-docs/)
 - Neat **interactive** documentation for nested objects <br>
  ![](docs/images/nested-demo.gif)

@ -177,7 +177,7 @@ to render your OpenAPI definition, refer to the
 [**Redoc quickstart guide**](https://redocly.com/docs/redoc/quickstart/) and [**How to use the HTML element**](https://redocly.com/docs/redoc/deployment/html/).

 ## Redoc CLI
-For more information on Redoc's commmand-line interface, refer to
+For more information on Redoc's command-line interface, refer to
 [**Using the Redoc CLI**](https://redocly.com/docs/redoc/deployment/cli/).


--- a/cli/README.md
+++ b/cli/README.md
@ -1,5 +1,7 @@
 # redoc-cli

+**DEPRECATED: this package is deprecated. Use `npx @redocly/cli build-docs <api>` instead.**
+
 **[ReDoc](https://github.com/Redocly/redoc)'s Command Line Interface**

 ## Installation
@ -16,7 +18,7 @@ The two following commands are available:
  and can watch the spec (`--watch`) to automatically reload the page whenever it changes.\
  Deprecated. Use `npx @redocly/cli preview-docs [spec]`
 - `redoc-cli bundle [spec]` - bundles `spec` and Redoc into a **zero-dependency** HTML file.\
-  Deprecated. Use Use "build" command instead.
+  Deprecated. Use "build" command instead.
 - `redoc-cli build [spec]` - build `spec` and Redoc into a **zero-dependency** HTML file.

 Some examples:
--- a/cli/index.ts
+++ b/cli/index.ts
@ -1,7 +1,6 @@
 #!/usr/bin/env node
 /* tslint:disable:no-implicit-dependencies */
-import * as React from 'react';
-import * as updateNotifier from 'update-notifier';
+import { createElement } from 'react';
 import { renderToString } from 'react-dom/server';
 import { ServerStyleSheet } from 'styled-components';

@ -10,6 +9,7 @@ import { createServer, IncomingMessage, ServerResponse } from 'http';
 import { dirname, join, resolve, extname as getExtName } from 'path';

 import * as zlib from 'zlib';
+import * as boxen from 'boxen';

 // @ts-ignore
 import { createStore, loadAndBundleSpec, Redoc } from 'redoc';
@ -66,6 +66,14 @@ export const mimeTypes = {

 const BUNDLES_DIR = dirname(require.resolve('redoc'));

+const boxenOptions = {
+  title: 'DEPRECATED',
+  titleAlignment: 'center',
+  padding: 1,
+  margin: 1,
+  borderColor: 'red',
+} as boxen.Options;
+
 const builderForBuildCommand = yargs => {
  yargs.positional('spec', {
    describe: 'path or URL to your spec',
@ -112,7 +120,6 @@ const handlerForBuildCommand = async (argv: any) => {
  };

  try {
-    notifyUpdateCliVersion();
    await bundle(argv.spec, config);
  } catch (e) {
    handleError(e);
@ -121,7 +128,7 @@ const handlerForBuildCommand = async (argv: any) => {

 YargsParser.command(
  'serve <spec>',
-  'start the server',
+  'start the server [deprecated]',
  yargs => {
    yargs.positional('spec', {
      describe: 'path or URL to your spec',
@ -176,7 +183,6 @@ YargsParser.command(
    };

    try {
-      notifyUpdateCliVersion();
      await serve(argv.host as string, argv.port as number, argv.spec as string, config);
    } catch (e) {
      handleError(e);
@ -184,30 +190,31 @@ YargsParser.command(
  },
  [
    res => {
-      console.log(
-        `\n⚠️ This command is deprecated. Use "npx @redocly/cli preview-docs petstore.yaml"\n`,
-      );
+      console.log(`
+        ${boxen(
+          'This package is deprecated.\n\nUse `npx @redocly/cli preview-docs <api>` instead.',
+          boxenOptions,
+        )}`);
      return res;
    },
  ],
+  true,
 )
  .command(
    'build <spec>',
-    'build definition into zero-dependency HTML-file',
+    'build definition into zero-dependency HTML-file [deprecated]',
    builderForBuildCommand,
    handlerForBuildCommand,
+    [notifyDeprecation],
+    true,
  )
  .command(
    'bundle <spec>',
    'bundle spec into zero-dependency HTML-file [deprecated]',
    builderForBuildCommand,
    handlerForBuildCommand,
-    [
-      res => {
-        console.log(`\n⚠️ This command is deprecated. Use "build" command instead.\n`);
-        return res;
-      },
-    ],
+    [notifyDeprecation],
+    true,
  )
  .demandCommand()
  .options('t', {
@ -344,7 +351,7 @@ async function getPageHTML(
    const store = await createStore(spec, specUrl, redocOptions);
    const sheet = new ServerStyleSheet();
    // @ts-ignore
-    html = renderToString(sheet.collectStyles(React.createElement(Redoc, { store })));
+    html = renderToString(sheet.collectStyles(createElement(Redoc, { store })));
    css = sheet.getStyleTags();
    state = await store.toJS();

@ -472,15 +479,12 @@ function getObjectOrJSON(options) {
  }
 }

-function notifyUpdateCliVersion() {
-  const pkg = require('./package.json');
-  const notifier = updateNotifier({
-    pkg,
-    updateCheckInterval: 0,
-    shouldNotifyInNpmScript: true,
-  });
-  notifier.notify({
-    message:
-      'Run `{updateCommand}` to update.\nChangelog: https://github.com/Redocly/redoc/releases/tag/{latestVersion}',
-  });
+function notifyDeprecation(res: YargsParser.Arguments): YargsParser.Arguments {
+  console.log(
+    boxen(
+      'This package is deprecated.\n\nUse `npx @redocly/cli build-docs <api>` instead.',
+      boxenOptions,
+    ),
+  );
+  return res;
 }
--- a/cli/npm-shrinkwrap.json
+++ b/cli/npm-shrinkwrap.json
--- a/cli/package.json
+++ b/cli/package.json
@ -1,6 +1,6 @@
 {
  "name": "redoc-cli",
-  "version": "0.13.20",
+  "version": "0.13.21",
  "description": "ReDoc's Command Line Interface",
  "main": "index.js",
  "bin": "index.js",
@ -11,6 +11,7 @@
    "node": ">=12.0.0"
  },
  "dependencies": {
+    "boxen": "5.1.2",
    "chokidar": "^3.5.1",
    "handlebars": "^4.7.7",
    "mkdirp": "^1.0.4",
@ -18,9 +19,8 @@
    "node-libs-browser": "^2.2.1",
    "react": "^17.0.1",
    "react-dom": "^17.0.1",
-    "redoc": "2.0.0-rc.77",
+    "redoc": "2.0.0",
    "styled-components": "^5.3.0",
-    "update-notifier": "^5.0.1",
    "yargs": "^17.3.1"
  },
  "publishConfig": {
--- a/demo/openapi-3-1.yaml
+++ b/demo/openapi-3-1.yaml
@ -805,11 +805,17 @@ paths:
      parameters:
        - name: username
          in: path
-          description: name that need to be deleted
+          description: name that need to be updated
          required: true
          schema:
            type: string
      responses:
+        '200':
+          description: User is updated successfully
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/User'
        '400':
          description: Invalid user supplied
        '404':
@ -835,6 +841,8 @@ paths:
          schema:
            type: string
      responses:
+        '204':
+          description: User is deleted
        '400':
          description: Invalid username supplied
        '404':
--- a/docs/deployment/cli.md
+++ b/docs/deployment/cli.md
@ -4,111 +4,33 @@ redirectFrom:
  - /docs/redoc/quickstart/cli/
 ---

-# How to use the Redoc CLI
+# How to use the Redocly CLI

-With Redoc's command-line interface you can bundle your OpenAPI definition and API documentation
-(made with Redoc) into a zero-dependency HTML file and locally render your
-OpenAPI definition with Redoc.
+With Redocly CLI, you can bundle your OpenAPI definition and API documentation
+(made with Redoc) into a zero-dependency HTML file and render it locally.

-## Step 1 - Install Redoc CLI
+## Step 1 - Install Redocly CLI

-You can install the `redoc-cli` package globally using one of the following package managers:
+First, you need to install the `@redocly/cli` package. 

- [npm](https://docs.npmjs.com/about-npm)
- [yarn](https://classic.yarnpkg.com/en/docs/getting-started)
+You can install it [globally](/docs/cli/installation.md#global-installation) using npm or Yarn. 

-Or you can install `redoc-cli` using [npx](https://www.freecodecamp.org/news/npm-vs-npx-whats-the-difference/).
+Or you can install it during [runtime](/docs/cli/installation.md#runtime-installation) using npx or Docker.

-### Install Redoc CLI with yarn
+## Step 2 - Build the HTML file

-To install the `redoc-cli` package globally with yarn:
+The Redocly CLI `build-docs` command builds Redoc into a zero-dependency HTML file.
+
+To build a zero-dependency HTML file using Redocly CLI, enter the following command,
+replacing `apis/openapi.yaml` with your API definition file's name and path:

 ```bash
-yarn global add redoc-cli
+redocly build-docs apis/openapi.yaml
 ```

-### Install Redoc with npm
+See the [build-docs](../../cli/commands/build-docs.md) documentation for more information
+on the different options and ways you can use the command.

-To install the `redoc-cli` package globally with npm:
-
-```bash
-npm i -g redoc-cli
-```
-
-### Install with `npx`
-
-To install the `redoc-cli` package locally with `npx`, navigate to your project
-directory in your terminal, then use the following command:
-
-```bash
-npx redoc-cli
-```
-
-## Step 2 - Use the CLI
-
-### Redoc CLI commands
-
-The CLI includes the following commands:
-
- **`redoc-cli serve [spec]`:** Starts a local server with Redoc. You must include the required parameter, spec, which is
-  a reference to an OpenAPI definition. Options include:
-    - `--ssr`: Implements a server-side rendering model.
-    - `--watch`: Automatically reloads the server while you edit your OpenAPI definition.
-    - `--options`: Customizes your output using [Redoc functionality options](https://redocly.com/docs/api-reference-docs/configuration/functionality) or [Redoc theming options](https://redocly.com/docs/api-reference-docs/configuration/theming).
-      To add nested options, use dot notation.
- **`redoc-cli build [spec]`:** Builds `spec` and Redoc into a zero-dependency HTML file. Options include:
-    - `-t` or `--template`: Uses custom [Handlebars](https://handlebarsjs.com/) templates to render your OpenAPI definition.
-    - `--templateOptions`: Adds template options you want to pass to your
-      custom Handlebars template. To add options, use dot notation.
- **`--help`:** Prints help text for the Redoc CLI commands and options.
- **`--version`:** Prints the version of the `redoc-cli` package you have installed.
-
-### Redoc CLI examples
-
-#### Bundle
-
-Bundle with the main color changed to `orange`:
-
-```bash
-redoc-cli build openapi.yaml --options.theme.colors.primary.main=orange
-```
-
-Bundle using a custom Handlebars template and add custom `templateOptions`:
-
-```bash
-redoc-cli build http://petstore.swagger.io/v2/swagger.json -t custom.hbs --templateOptions.metaDescription "Page meta description"
-```
-
-Sample Handlebars template:
-
-```handlebars
-<!DOCTYPE html>
-<html>
-    <head>
-        <meta charset="utf8" />
-        <title>{{title}}</title>
-        <!-- needed for adaptive design -->
-        <meta description="{{{templateOptions.metaDescription}}}">
-        <meta name="viewport" content="width=device-width, initial-scale=1">
-        <style>
-            body {
-            padding: 0;
-            margin: 0;
-            }
-        </style>
-        {{{redocHead}}}
-        {{#unless disableGoogleFont}}<link href="https://fonts.googleapis.com/css?family=Montserrat:300,400,700|Roboto:300,400,700" rel="stylesheet">{{/unless}}
-    </head>
-    <body>
-      {{{redocHTML}}}
-    </body>
-</html>
-```
-
-#### Serve
-
-Serve with the `nativeScrollbars` option set to `true`:
-
-```bash
-redoc-cli serve  openapi/dist.yaml --options.nativeScrollbars
-```
+Also, check out [Redocly CLI commands](../../cli/commands/index.md), for more
+information on the different things you can do with Redocly CLI including
+linting, splitting, and bundling your API definition file.
--- a/docs/deployment/intro.md
+++ b/docs/deployment/intro.md
@ -21,8 +21,8 @@ The following options are supported:
  Using the React component is an option for users with a React-based application.
 - **[Docker image](./docker.md):**
  Using the Docker image works in a container-based deployment.
- **[CLI](./cli.md):**
-  Using the CLI is an option for users who prefer to use a command-line interface.
+- **[Redocly CLI](./cli.md):**
+  Using the Redocly CLI is an option for users who prefer to use a command-line interface.

 ## Before you start

--- a/e2e/integration/search.e2e.ts
+++ b/e2e/integration/search.e2e.ts
@ -1,7 +1,7 @@
 describe('Search', () => {
  const getSearchInput = () => cy.get('[role="search"] input');
  const getSearchResults = () => cy.get('[data-role="search:results"]');
-  const getResult = i => cy.get('[role=search] [role=menuitem]').eq(i).find('label');
+  const getResult = i => cy.get('[role=search] label').eq(i);

  beforeEach(() => {
    cy.visit('e2e/standalone.html');
@ -45,7 +45,8 @@ describe('Search', () => {

    getSearchInput().type('{enter}', { force: true });

-    cy.contains('[role=menu] [role=menuitem] label', 'Introduction').should('have.class', 'active');
+
+    cy.contains('[role=menu] label', 'Introduction').should('have.class', 'active');
  });

  it('should mark search results', () => {
--- a/package-lock.json
+++ b/package-lock.json
@ -19,7 +19,7 @@
        "mark.js": "^8.11.1",
        "marked": "^4.0.15",
        "mobx-react": "^7.2.0",
-        "openapi-sampler": "^1.3.0",
+        "openapi-sampler": "^1.3.1",
        "path-browserify": "^1.0.1",
        "perfect-scrollbar": "^1.5.5",
        "polished": "^4.1.3",
@ -14378,9 +14378,9 @@
      }
    },
    "node_modules/openapi-sampler": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/openapi-sampler/-/openapi-sampler-1.3.0.tgz",
-      "integrity": "sha512-2QfjK1oM9Sv0q82Ae1RrUe3yfFmAyjF548+6eAeb+h/cL1Uj51TW4UezraBEvwEdzoBgfo4AaTLVFGTKj+yYDw==",
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/openapi-sampler/-/openapi-sampler-1.3.1.tgz",
+      "integrity": "sha512-Ert9mvc2tLPmmInwSyGZS+v4Ogu9/YoZuq9oP3EdUklg2cad6+IGndP9yqJJwbgdXwZibiq5fpv6vYujchdJFg==",
      "dependencies": {
        "@types/json-schema": "^7.0.7",
        "json-pointer": "0.6.2"
@ -30172,9 +30172,9 @@
      }
    },
    "openapi-sampler": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/openapi-sampler/-/openapi-sampler-1.3.0.tgz",
-      "integrity": "sha512-2QfjK1oM9Sv0q82Ae1RrUe3yfFmAyjF548+6eAeb+h/cL1Uj51TW4UezraBEvwEdzoBgfo4AaTLVFGTKj+yYDw==",
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/openapi-sampler/-/openapi-sampler-1.3.1.tgz",
+      "integrity": "sha512-Ert9mvc2tLPmmInwSyGZS+v4Ogu9/YoZuq9oP3EdUklg2cad6+IGndP9yqJJwbgdXwZibiq5fpv6vYujchdJFg==",
      "requires": {
        "@types/json-schema": "^7.0.7",
        "json-pointer": "0.6.2"
--- a/package.json
+++ b/package.json
@ -151,7 +151,7 @@
    "mark.js": "^8.11.1",
    "marked": "^4.0.15",
    "mobx-react": "^7.2.0",
-    "openapi-sampler": "^1.3.0",
+    "openapi-sampler": "^1.3.1",
    "path-browserify": "^1.0.1",
    "perfect-scrollbar": "^1.5.5",
    "polished": "^4.1.3",
--- a/src/components/Parameters/Parameters.tsx
+++ b/src/components/Parameters/Parameters.tsx
@ -1,5 +1,5 @@
 import * as React from 'react';
-import { DropdownOrLabel } from '../DropdownOrLabel/DropdownOrLabel';
+import { DropdownOrLabel, DropdownOrLabelProps } from '../DropdownOrLabel/DropdownOrLabel';
 import { ParametersGroup } from './ParametersGroup';

 import { UnderlinedHeader } from '../../common-elements';
@ -11,6 +11,8 @@ import { Schema } from '../Schema';

 import { Markdown } from '../Markdown/Markdown';
 import { ConstraintsView } from '../Fields/FieldContstraints';
+import { RequiredLabel } from '../../common-elements/fields';
+import styled from '../../styled-components';

 function safePush(obj, prop, item) {
  if (!obj[prop]) {
@ -49,21 +51,37 @@ export class Parameters extends React.PureComponent<ParametersProps> {

    const bodyDescription = body && body.description;

+    const bodyRequired = body && body.required;
+
    return (
      <>
        {paramsPlaces.map(place => (
          <ParametersGroup key={place} place={place} parameters={paramsMap[place]} />
        ))}
-        {bodyContent && <BodyContent content={bodyContent} description={bodyDescription} />}
+        {bodyContent && (
+          <BodyContent
+            content={bodyContent}
+            description={bodyDescription}
+            bodyRequired={bodyRequired}
+          />
+        )}
      </>
    );
  }
 }

-function DropdownWithinHeader(props) {
+function DropdownWithinHeader({
+  bodyRequired,
+  ...props
+}: DropdownOrLabelProps & { bodyRequired?: boolean }) {
+  const isRequired = typeof bodyRequired === 'boolean' && !!bodyRequired;
+  const isOptional = typeof bodyRequired === 'boolean' && !bodyRequired;
+
  return (
    <UnderlinedHeader key="header">
      Request Body schema: <DropdownOrLabel {...props} />
+      {isRequired && <RequiredBody>required</RequiredBody>}
+      {isOptional && <OptionalBody>optional</OptionalBody>}
    </UnderlinedHeader>
  );
 }
@ -71,11 +89,15 @@ function DropdownWithinHeader(props) {
 export function BodyContent(props: {
  content: MediaContentModel;
  description?: string;
+  bodyRequired?: boolean;
 }): JSX.Element {
-  const { content, description } = props;
+  const { content, description, bodyRequired } = props;
  const { isRequestType } = content;
  return (
-    <MediaTypesSwitch content={content} renderDropdown={DropdownWithinHeader}>
+    <MediaTypesSwitch
+      content={content}
+      renderDropdown={props => <DropdownWithinHeader bodyRequired={bodyRequired} {...props} />}
+    >
      {({ schema }) => {
        return (
          <>
@ -95,3 +117,19 @@ export function BodyContent(props: {
    </MediaTypesSwitch>
  );
 }
+
+const commonStyles = `
+  text-transform: lowercase;
+  margin-left: 0;
+  line-height: 1.5em;
+`;
+
+const RequiredBody = styled(RequiredLabel)`
+  ${commonStyles}
+`;
+
+const OptionalBody = styled('div')`
+  ${commonStyles}
+  color: ${({ theme }) => theme.colors.text.secondary};
+  font-size: ${props => props.theme.schema.labelsTextSize};
+`;
--- a/src/components/tests/snapshots/SecurityRequirement.test.tsx.snap
+++ b/src/components/tests/snapshots/SecurityRequirement.test.tsx.snap
@ -3,21 +3,21 @@
 exports[`SecurityRequirement should render SecurityDefs 1`] = `
 "<div id=\\"section/Authentication/petstore_auth\\" data-section-id=\\"section/Authentication/petstore_auth\\" class=\\"sc-eCApnc jlMQbh\\"><div class=\\"sc-iCoGMd gLxhOh\\"><div class=\\"sc-hKFxyN juinod\\"><h2 class=\\"sc-pNWdM eftmgB\\">petstore_auth</h2><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><p>Get access to data while protecting your account credentials.
 OAuth2 is also a safer and more secure way to give you access.</p>
-</div><div class=\\"sc-EZqKI aOkZE\\"><div class=\\"sc-fXgAZx gZCyoW\\"><b>Security Scheme Type: </b><span>OAuth2</span></div><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><div class=\\"sc-fXgAZx gZCyoW\\"><b>Flow type: </b><code>implicit </code></div><div class=\\"sc-fXgAZx gZCyoW\\"><strong> Authorization URL: </strong><code><a target=\\"_blank\\" rel=\\"noopener noreferrer\\" href=\\"http://petstore.swagger.io/api/oauth/dialog\\">http://petstore.swagger.io/api/oauth/dialog</a></code></div><div class=\\"sc-fXgAZx gZCyoW\\"><b> Scopes: </b></div><div class=\\"sc-jXcxbT blWOKY container\\" style=\\"height: 4em;\\"><ul><li><code>write:pets</code> - <span class=\\"sc-carFqZ bmTzxo redoc-markdown\\"><p>modify pets in your account</p>
+</div><div class=\\"sc-eEVmNe lmbHgE\\"><div class=\\"sc-jXcxbT gllWlr\\"><b>Security Scheme Type: </b><span>OAuth2</span></div><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><div class=\\"sc-jXcxbT gllWlr\\"><b>Flow type: </b><code>implicit </code></div><div class=\\"sc-jXcxbT gllWlr\\"><strong> Authorization URL: </strong><code><a target=\\"_blank\\" rel=\\"noopener noreferrer\\" href=\\"http://petstore.swagger.io/api/oauth/dialog\\">http://petstore.swagger.io/api/oauth/dialog</a></code></div><div class=\\"sc-jXcxbT gllWlr\\"><b> Scopes: </b></div><div class=\\"sc-fmdNqN eKoRDV container\\" style=\\"height: 4em;\\"><ul><li><code>write:pets</code> - <span class=\\"sc-carFqZ bmTzxo redoc-markdown\\"><p>modify pets in your account</p>
 </span></li><li><code>read:pets</code> - <span class=\\"sc-carFqZ bmTzxo redoc-markdown\\"><p>read your pets</p>
-</span></li></ul></div><div class=\\"sc-eEVmNe gbLbHj\\"></div></div></div></div></div></div><div id=\\"section/Authentication/GitLab_PersonalAccessToken\\" data-section-id=\\"section/Authentication/GitLab_PersonalAccessToken\\" class=\\"sc-eCApnc jlMQbh\\"><div class=\\"sc-iCoGMd gLxhOh\\"><div class=\\"sc-hKFxyN juinod\\"><h2 class=\\"sc-pNWdM eftmgB\\">GitLab_PersonalAccessToken</h2><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><p>GitLab Personal Access Token description</p>
-</div><div class=\\"sc-EZqKI aOkZE\\"><div class=\\"sc-fXgAZx gZCyoW\\"><b>Security Scheme Type: </b><span>API Key</span></div><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><div class=\\"sc-fXgAZx gZCyoW\\"><b>Header parameter name: </b><code>PRIVATE-TOKEN</code></div></div></div></div></div></div><div id=\\"section/Authentication/GitLab_OpenIdConnect\\" data-section-id=\\"section/Authentication/GitLab_OpenIdConnect\\" class=\\"sc-eCApnc jlMQbh\\"><div class=\\"sc-iCoGMd gLxhOh\\"><div class=\\"sc-hKFxyN juinod\\"><h2 class=\\"sc-pNWdM eftmgB\\">GitLab_OpenIdConnect</h2><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><p>GitLab OpenIdConnect description</p>
-</div><div class=\\"sc-EZqKI aOkZE\\"><div class=\\"sc-fXgAZx gZCyoW\\"><b>Security Scheme Type: </b><span>OpenID Connect</span></div><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><div class=\\"sc-fXgAZx gZCyoW\\"><b>Connect URL: </b><code><a target=\\"_blank\\" rel=\\"noopener noreferrer\\" href=\\"https://gitlab.com/.well-known/openid-configuration\\">https://gitlab.com/.well-known/openid-configuration</a></code></div></div></div></div></div></div><div id=\\"section/Authentication/basicAuth\\" data-section-id=\\"section/Authentication/basicAuth\\" class=\\"sc-eCApnc jlMQbh\\"><div class=\\"sc-iCoGMd gLxhOh\\"><div class=\\"sc-hKFxyN juinod\\"><h2 class=\\"sc-pNWdM eftmgB\\">basicAuth</h2><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"></div><div class=\\"sc-EZqKI aOkZE\\"><div class=\\"sc-fXgAZx gZCyoW\\"><b>Security Scheme Type: </b><span>HTTP</span></div><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><div class=\\"sc-fXgAZx gZCyoW\\"><b>HTTP Authorization Scheme: </b><code>basic</code></div><div class=\\"sc-fXgAZx gZCyoW\\"></div></div></div></div></div></div>"
+</span></li></ul></div><div class=\\"sc-ljsmAU blhEdv\\"></div></div></div></div></div></div><div id=\\"section/Authentication/GitLab_PersonalAccessToken\\" data-section-id=\\"section/Authentication/GitLab_PersonalAccessToken\\" class=\\"sc-eCApnc jlMQbh\\"><div class=\\"sc-iCoGMd gLxhOh\\"><div class=\\"sc-hKFxyN juinod\\"><h2 class=\\"sc-pNWdM eftmgB\\">GitLab_PersonalAccessToken</h2><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><p>GitLab Personal Access Token description</p>
+</div><div class=\\"sc-eEVmNe lmbHgE\\"><div class=\\"sc-jXcxbT gllWlr\\"><b>Security Scheme Type: </b><span>API Key</span></div><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><div class=\\"sc-jXcxbT gllWlr\\"><b>Header parameter name: </b><code>PRIVATE-TOKEN</code></div></div></div></div></div></div><div id=\\"section/Authentication/GitLab_OpenIdConnect\\" data-section-id=\\"section/Authentication/GitLab_OpenIdConnect\\" class=\\"sc-eCApnc jlMQbh\\"><div class=\\"sc-iCoGMd gLxhOh\\"><div class=\\"sc-hKFxyN juinod\\"><h2 class=\\"sc-pNWdM eftmgB\\">GitLab_OpenIdConnect</h2><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><p>GitLab OpenIdConnect description</p>
+</div><div class=\\"sc-eEVmNe lmbHgE\\"><div class=\\"sc-jXcxbT gllWlr\\"><b>Security Scheme Type: </b><span>OpenID Connect</span></div><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><div class=\\"sc-jXcxbT gllWlr\\"><b>Connect URL: </b><code><a target=\\"_blank\\" rel=\\"noopener noreferrer\\" href=\\"https://gitlab.com/.well-known/openid-configuration\\">https://gitlab.com/.well-known/openid-configuration</a></code></div></div></div></div></div></div><div id=\\"section/Authentication/basicAuth\\" data-section-id=\\"section/Authentication/basicAuth\\" class=\\"sc-eCApnc jlMQbh\\"><div class=\\"sc-iCoGMd gLxhOh\\"><div class=\\"sc-hKFxyN juinod\\"><h2 class=\\"sc-pNWdM eftmgB\\">basicAuth</h2><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"></div><div class=\\"sc-eEVmNe lmbHgE\\"><div class=\\"sc-jXcxbT gllWlr\\"><b>Security Scheme Type: </b><span>HTTP</span></div><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><div class=\\"sc-jXcxbT gllWlr\\"><b>HTTP Authorization Scheme: </b><code>basic</code></div><div class=\\"sc-jXcxbT gllWlr\\"></div></div></div></div></div></div>"
 `;

-exports[`SecurityRequirement should render authDefinition 1`] = `"<div class=\\"sc-bQCEYZ eDdCgW\\"><div class=\\"sc-xGAEC femyTb\\"><h5 class=\\"sc-iqAclL sc-jHcXXw eONCmm keQLTh\\">Authorizations:</h5><svg class=\\"sc-dIsUp iPqByX\\" version=\\"1.1\\" viewBox=\\"0 0 24 24\\" x=\\"0\\" xmlns=\\"http://www.w3.org/2000/svg\\" y=\\"0\\" aria-hidden=\\"true\\"><polygon points=\\"17.3 8.3 12 13.6 6.7 8.3 5.3 9.7 12 16.4 18.7 9.7 \\"></polygon></svg></div><div class=\\"sc-dWBRfb kJFNCL\\"><span class=\\"sc-kYPZxB irJeRy\\">(<span class=\\"sc-hzUIXc gcouO\\">API Key: <i>GitLab_PersonalAccessToken</i></span><span class=\\"sc-hzUIXc gcouO\\">OpenID Connect: <i>GitLab_OpenIdConnect</i></span><span class=\\"sc-hzUIXc gcouO\\">HTTP: <i>basicAuth</i></span>) </span><span class=\\"sc-kYPZxB irJeRy\\"><span class=\\"sc-hzUIXc gcouO\\">OAuth2: <i>petstore_auth</i></span></span></div></div>,"`;
+exports[`SecurityRequirement should render authDefinition 1`] = `"<div class=\\"sc-EZqKI eriJMk\\"><div class=\\"sc-jHcXXw kurgNF\\"><h5 class=\\"sc-iqAclL sc-fXgAZx eONCmm xiVXt\\">Authorizations:</h5><svg class=\\"sc-dIsUp iPqByX\\" version=\\"1.1\\" viewBox=\\"0 0 24 24\\" x=\\"0\\" xmlns=\\"http://www.w3.org/2000/svg\\" y=\\"0\\" aria-hidden=\\"true\\"><polygon points=\\"17.3 8.3 12 13.6 6.7 8.3 5.3 9.7 12 16.4 18.7 9.7 \\"></polygon></svg></div><div class=\\"sc-bQCEYZ cCwYjG\\"><span class=\\"sc-dWBRfb hoKBYz\\">(<span class=\\"sc-xGAEC bCFTJj\\">API Key: <i>GitLab_PersonalAccessToken</i></span><span class=\\"sc-xGAEC bCFTJj\\">OpenID Connect: <i>GitLab_OpenIdConnect</i></span><span class=\\"sc-xGAEC bCFTJj\\">HTTP: <i>basicAuth</i></span>) </span><span class=\\"sc-dWBRfb hoKBYz\\"><span class=\\"sc-xGAEC bCFTJj\\">OAuth2: <i>petstore_auth</i></span></span></div></div>,"`;

 exports[`SecurityRequirement should render authDefinition 2`] = `
-"<div class=\\"sc-bQCEYZ dSwEDq\\"><div class=\\"sc-xGAEC femyTb\\"><h5 class=\\"sc-iqAclL sc-jHcXXw eONCmm keQLTh\\">Authorizations:</h5><svg class=\\"sc-dIsUp fVWtGJ\\" version=\\"1.1\\" viewBox=\\"0 0 24 24\\" x=\\"0\\" xmlns=\\"http://www.w3.org/2000/svg\\" y=\\"0\\" aria-hidden=\\"true\\"><polygon points=\\"17.3 8.3 12 13.6 6.7 8.3 5.3 9.7 12 16.4 18.7 9.7 \\"></polygon></svg></div><div class=\\"sc-dWBRfb ekRdav\\"><span class=\\"sc-kYPZxB fhGdrc\\">(<span class=\\"sc-hzUIXc gcouO\\">API Key: <i>GitLab_PersonalAccessToken</i></span><span class=\\"sc-hzUIXc gcouO\\">OpenID Connect: <i>GitLab_OpenIdConnect</i></span><span class=\\"sc-hzUIXc gcouO\\">HTTP: <i>basicAuth</i></span>) </span><span class=\\"sc-kYPZxB fhGdrc\\"><span class=\\"sc-hzUIXc gcouO\\">OAuth2: <i>petstore_auth</i> (<code class=\\"sc-eHEENL fwFTyL\\">write:pets</code><code class=\\"sc-eHEENL fwFTyL\\">read:pets</code>) </span></span></div></div><div class=\\"sc-EZqKI aOkZE\\"><h5><svg xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 24 24\\" width=\\"11\\" height=\\"11\\"><path fill=\\"currentColor\\" d=\\"M18 10V6A6 6 0 0 0 6 6v4H3v14h18V10h-3zM8 6c0-2.206 1.794-4 4-4s4 1.794 4 4v4H8V6zm11 16H5V12h14v10z\\"></path></svg> OAuth2: petstore_auth</h5><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><p>Get access to data while protecting your account credentials.
+"<div class=\\"sc-EZqKI hSmRqE\\"><div class=\\"sc-jHcXXw kurgNF\\"><h5 class=\\"sc-iqAclL sc-fXgAZx eONCmm xiVXt\\">Authorizations:</h5><svg class=\\"sc-dIsUp fVWtGJ\\" version=\\"1.1\\" viewBox=\\"0 0 24 24\\" x=\\"0\\" xmlns=\\"http://www.w3.org/2000/svg\\" y=\\"0\\" aria-hidden=\\"true\\"><polygon points=\\"17.3 8.3 12 13.6 6.7 8.3 5.3 9.7 12 16.4 18.7 9.7 \\"></polygon></svg></div><div class=\\"sc-bQCEYZ gvMhNy\\"><span class=\\"sc-dWBRfb eLEzSd\\">(<span class=\\"sc-xGAEC bCFTJj\\">API Key: <i>GitLab_PersonalAccessToken</i></span><span class=\\"sc-xGAEC bCFTJj\\">OpenID Connect: <i>GitLab_OpenIdConnect</i></span><span class=\\"sc-xGAEC bCFTJj\\">HTTP: <i>basicAuth</i></span>) </span><span class=\\"sc-dWBRfb eLEzSd\\"><span class=\\"sc-xGAEC bCFTJj\\">OAuth2: <i>petstore_auth</i> (<code class=\\"sc-kYPZxB beMTTe\\">write:pets</code><code class=\\"sc-kYPZxB beMTTe\\">read:pets</code>) </span></span></div></div><div class=\\"sc-eEVmNe lmbHgE\\"><h5><svg xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 24 24\\" width=\\"11\\" height=\\"11\\"><path fill=\\"currentColor\\" d=\\"M18 10V6A6 6 0 0 0 6 6v4H3v14h18V10h-3zM8 6c0-2.206 1.794-4 4-4s4 1.794 4 4v4H8V6zm11 16H5V12h14v10z\\"></path></svg> OAuth2: petstore_auth</h5><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><p>Get access to data while protecting your account credentials.
 OAuth2 is also a safer and more secure way to give you access.</p>
-</div><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><div class=\\"sc-fXgAZx gZCyoW\\"><b>Flow type: </b><code>implicit </code></div><div class=\\"sc-fXgAZx gZCyoW\\"><strong> Authorization URL: </strong><code><a target=\\"_blank\\" rel=\\"noopener noreferrer\\" href=\\"http://petstore.swagger.io/api/oauth/dialog\\">http://petstore.swagger.io/api/oauth/dialog</a></code></div><div><b>Required scopes: </b><code>write:pets</code> <code>read:pets</code> </div><div class=\\"sc-fXgAZx gZCyoW\\"><b> Scopes: </b></div><div class=\\"sc-jXcxbT blWOKY container\\" style=\\"height: 4em;\\"><ul><li><code>write:pets</code> - <span class=\\"sc-carFqZ bmTzxo redoc-markdown\\"><p>modify pets in your account</p>
+</div><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><div class=\\"sc-jXcxbT gllWlr\\"><b>Flow type: </b><code>implicit </code></div><div class=\\"sc-jXcxbT gllWlr\\"><strong> Authorization URL: </strong><code><a target=\\"_blank\\" rel=\\"noopener noreferrer\\" href=\\"http://petstore.swagger.io/api/oauth/dialog\\">http://petstore.swagger.io/api/oauth/dialog</a></code></div><div><b>Required scopes: </b><code>write:pets</code> <code>read:pets</code> </div><div class=\\"sc-jXcxbT gllWlr\\"><b> Scopes: </b></div><div class=\\"sc-fmdNqN eKoRDV container\\" style=\\"height: 4em;\\"><ul><li><code>write:pets</code> - <span class=\\"sc-carFqZ bmTzxo redoc-markdown\\"><p>modify pets in your account</p>
 </span></li><li><code>read:pets</code> - <span class=\\"sc-carFqZ bmTzxo redoc-markdown\\"><p>read your pets</p>
-</span></li></ul></div><div class=\\"sc-eEVmNe gbLbHj\\"></div></div></div><div class=\\"sc-EZqKI aOkZE\\"><h5><svg xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 24 24\\" width=\\"11\\" height=\\"11\\"><path fill=\\"currentColor\\" d=\\"M18 10V6A6 6 0 0 0 6 6v4H3v14h18V10h-3zM8 6c0-2.206 1.794-4 4-4s4 1.794 4 4v4H8V6zm11 16H5V12h14v10z\\"></path></svg> API Key: GitLab_PersonalAccessToken</h5><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><p>GitLab Personal Access Token description</p>
-</div><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><div class=\\"sc-fXgAZx gZCyoW\\"><b>Header parameter name: </b><code>PRIVATE-TOKEN</code></div></div></div><div class=\\"sc-EZqKI aOkZE\\"><h5><svg xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 24 24\\" width=\\"11\\" height=\\"11\\"><path fill=\\"currentColor\\" d=\\"M18 10V6A6 6 0 0 0 6 6v4H3v14h18V10h-3zM8 6c0-2.206 1.794-4 4-4s4 1.794 4 4v4H8V6zm11 16H5V12h14v10z\\"></path></svg> OpenID Connect: GitLab_OpenIdConnect</h5><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><p>GitLab OpenIdConnect description</p>
-</div><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><div class=\\"sc-fXgAZx gZCyoW\\"><b>Connect URL: </b><code><a target=\\"_blank\\" rel=\\"noopener noreferrer\\" href=\\"https://gitlab.com/.well-known/openid-configuration\\">https://gitlab.com/.well-known/openid-configuration</a></code></div></div></div><div class=\\"sc-EZqKI aOkZE\\"><h5><svg xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 24 24\\" width=\\"11\\" height=\\"11\\"><path fill=\\"currentColor\\" d=\\"M18 10V6A6 6 0 0 0 6 6v4H3v14h18V10h-3zM8 6c0-2.206 1.794-4 4-4s4 1.794 4 4v4H8V6zm11 16H5V12h14v10z\\"></path></svg> HTTP: basicAuth</h5><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"></div><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><div class=\\"sc-fXgAZx gZCyoW\\"><b>HTTP Authorization Scheme: </b><code>basic</code></div><div class=\\"sc-fXgAZx gZCyoW\\"></div></div></div>,"
+</span></li></ul></div><div class=\\"sc-ljsmAU blhEdv\\"></div></div></div><div class=\\"sc-eEVmNe lmbHgE\\"><h5><svg xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 24 24\\" width=\\"11\\" height=\\"11\\"><path fill=\\"currentColor\\" d=\\"M18 10V6A6 6 0 0 0 6 6v4H3v14h18V10h-3zM8 6c0-2.206 1.794-4 4-4s4 1.794 4 4v4H8V6zm11 16H5V12h14v10z\\"></path></svg> API Key: GitLab_PersonalAccessToken</h5><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><p>GitLab Personal Access Token description</p>
+</div><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><div class=\\"sc-jXcxbT gllWlr\\"><b>Header parameter name: </b><code>PRIVATE-TOKEN</code></div></div></div><div class=\\"sc-eEVmNe lmbHgE\\"><h5><svg xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 24 24\\" width=\\"11\\" height=\\"11\\"><path fill=\\"currentColor\\" d=\\"M18 10V6A6 6 0 0 0 6 6v4H3v14h18V10h-3zM8 6c0-2.206 1.794-4 4-4s4 1.794 4 4v4H8V6zm11 16H5V12h14v10z\\"></path></svg> OpenID Connect: GitLab_OpenIdConnect</h5><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><p>GitLab OpenIdConnect description</p>
+</div><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><div class=\\"sc-jXcxbT gllWlr\\"><b>Connect URL: </b><code><a target=\\"_blank\\" rel=\\"noopener noreferrer\\" href=\\"https://gitlab.com/.well-known/openid-configuration\\">https://gitlab.com/.well-known/openid-configuration</a></code></div></div></div><div class=\\"sc-eEVmNe lmbHgE\\"><h5><svg xmlns=\\"http://www.w3.org/2000/svg\\" viewBox=\\"0 0 24 24\\" width=\\"11\\" height=\\"11\\"><path fill=\\"currentColor\\" d=\\"M18 10V6A6 6 0 0 0 6 6v4H3v14h18V10h-3zM8 6c0-2.206 1.794-4 4-4s4 1.794 4 4v4H8V6zm11 16H5V12h14v10z\\"></path></svg> HTTP: basicAuth</h5><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"></div><div class=\\"sc-iJCRrE sc-ciSkZP jCdxGr QGruV\\"><div class=\\"sc-jXcxbT gllWlr\\"><b>HTTP Authorization Scheme: </b><code>basic</code></div><div class=\\"sc-jXcxbT gllWlr\\"></div></div></div>,"
 `;
--- a/src/services/tests/models/RequestBody.test.ts
+++ b/src/services/tests/models/RequestBody.test.ts
@ -23,6 +23,14 @@ describe('Models', () => {
      const consoleError = jest.spyOn(global.console, 'error');
      const req = new RequestBodyModel(props);
      expect(consoleError).not.toHaveBeenCalled();
+      expect(req).toEqual({ description: '', required: undefined });
+    });
+
+    test('should work with set required', () => {
+      const consoleError = jest.spyOn(global.console, 'error');
+      props.infoOrRef.required = false;
+      const req = new RequestBodyModel(props);
+      expect(consoleError).not.toHaveBeenCalled();
      expect(req).toEqual({ description: '', required: false });
    });

--- a/src/services/models/RequestBody.ts
+++ b/src/services/models/RequestBody.ts
@ -14,14 +14,14 @@ type RequestBodyProps = {

 export class RequestBodyModel {
  description: string;
-  required: boolean;
+  required?: boolean;
  content?: MediaContentModel;

  constructor({ parser, infoOrRef, options, isEvent }: RequestBodyProps) {
    const isRequest = !isEvent;
    const { resolved: info } = parser.deref(infoOrRef);
    this.description = info.description || '';
-    this.required = !!info.required;
+    this.required = info.required;

    const mediaContent = getContentWithLegacyExamples(info);
    if (mediaContent !== undefined) {
--- a/src/utils/tests/snapshots/loadAndBundleSpec.test.ts.snap
+++ b/src/utils/tests/snapshots/loadAndBundleSpec.test.ts.snap
@ -3638,6 +3638,9 @@ culpa qui officia deserunt mollit anim id est laborum.
          },
        ],
        "responses": Object {
+          "204": Object {
+            "description": "User is deleted",
+          },
          "400": Object {
            "description": "Invalid username supplied",
          },
@ -3697,7 +3700,7 @@ culpa qui officia deserunt mollit anim id est laborum.
        "operationId": "updateUser",
        "parameters": Array [
          Object {
-            "description": "name that need to be deleted",
+            "description": "name that need to be updated",
            "in": "path",
            "name": "username",
            "required": true,
@ -3718,6 +3721,16 @@ culpa qui officia deserunt mollit anim id est laborum.
          "required": true,
        },
        "responses": Object {
+          "200": Object {
+            "content": Object {
+              "application/json": Object {
+                "schema": Object {
+                  "$ref": "#/components/schemas/User",
+                },
+              },
+            },
+            "description": "User is updated successfully",
+          },
          "400": Object {
            "description": "Invalid user supplied",
          },