feat: Add schema tab in Request and Response

[dsuket]

Description

Ensure that examples are displayed correctly when there are examples in the Media Type and Schema in the Request body and Response.

Motivation and Context

To address Issue #1158, I need to organize the example-related parts.
This is the 3rd step toward that goal.

Please see below first.

• refactor: refactor request and response example #1161
• refactor: change ResponseSamples to CodeSamples #1162

How Has This Been Tested?

• Pass npm run build
• Pass npm run test
• I went through the demo API and tests and confirmed that the examples are being displayed properly.

Screenshots (if appropriate)

example of schema in requestBody

examples of schema in requestBody

example of schema in response

examples of schema in response

Types of changes

• New feature (non-breaking change which adds functionality)

Checklist

• I have updated the documentation accordingly.
• I have read the CONTRIBUTING document.
• I have added tests to cover my changes if appropriate.
• All new and existing tests passed.

[github-actions]

Visit the preview URL for this PR (updated for commit 8ec03dc):

https://docusaurus-openapi-36b86--pr1164-kv9npimt.web.app

_{(expires Sat, 26 Jul 2025 17:23:49 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: bf293780ee827f578864d92193b8c2866acd459f}

[sserrata]

Hi @dsuket, I'm not opposed to exposing request samples/example schemas, but I do wonder if it duplicates the samples we already include in the "API Explorer" panel. I also wonder about the UX noise it may introduce, especially without a direct way to enable/disable the samples. Interested in your thoughts here.

[dsuket]

@sserrata Sorry for the late reply.
Is what you refer to as the "API Explorer" panel the REQUEST panel in the bottom right?

If so, then it is indeed displayed correctly for Media type examples.

However, for schema examples, it is not displayed correctly as shown below.

Therefore, I made it display in tabs for the Request, similar to the Response, as shown below.

Additionally, I believe that having the Request and Response displayed consistently makes it easier to recognize. In fact, I didn't notice the REQUEST panel in the bottom right until you pointed it out. 😅