chore(deps-dev): use tmp >= 0.2.4 (#2739)

This reverts commit acdb04bf01.

CHANGELOG.md

@@ -1,3 +1,32 @@
+# [2.5.2](https://github.com/Redocly/redoc/compare/v2.5.1...v2.5.2) (2025-10-15)
+
+
+### Bug Fixes
+
+* Bumped `openapi-sampler` dependency to include the fix for `readOnly`/`writeOnly` handling in allOf.
+
+
+# [2.5.1](https://github.com/Redocly/redoc/compare/v2.4.0...v2.5.1) (2025-09-26)
+
+
+### Bug Fixes
+
+* Bumped `mobx-react` dependency to address a security vulnerability.
+
+# [2.5.0](https://github.com/Redocly/redoc/compare/v2.4.0...v2.5.0) (2025-04-14)
+
+
+### Bug Fixes
+
+* enhance accessibility for menu items with keyboard support ([#2655](https://github.com/Redocly/redoc/issues/2655)) ([2db293b](https://github.com/Redocly/redoc/commit/2db293bfb2973497dd33f31dc99e97f5bb90bbe8))
+
+
+### Features
+
+* add keyboard navigation support to JsonViewer component ([#2654](https://github.com/Redocly/redoc/issues/2654)) ([1b4126f](https://github.com/Redocly/redoc/commit/1b4126fde4531387f49c90f52efbd0c0e5f7b6ea))
+
+
+
 # [2.4.0](https://github.com/Redocly/redoc/compare/v2.3.0...v2.4.0) (2025-02-07)
 
 

docs/deployment/cli.md

@@ -12,9 +12,9 @@ With Redocly CLI, you can bundle your OpenAPI definition and API documentation
 
 First, you need to install the `@redocly/cli` package.
 
-You can install it [globally](../../cli/installation.md#install-globally) using npm or Yarn.
+You can install it [globally](../../cli/installation#install-globally) using npm.
 
-Or you can install it during [runtime](../../cli/installation.md#use-npx-at-runtime) using npx or Docker.
+Or you can install it during [runtime](../../cli/installation#use-npx-at-runtime) using npx or Docker.
 
 ## Step 2 - Build the HTML file
 
@@ -27,9 +27,9 @@ replacing `apis/openapi.yaml` with your API definition file's name and path:
 redocly build-docs apis/openapi.yaml
 ```
 
-See the [build-docs](../../cli/commands/build-docs.md) documentation for more information
+See the [build-docs](../../cli/commands/build-docs) documentation for more information
 on the different options and ways you can use the command.
 
-Also, check out [Redocly CLI commands](../../cli/commands/index.md), for more
+Also, check out [Redocly CLI commands](../../cli/commands), for more
 information on the different things you can do with Redocly CLI including
 linting, splitting, and bundling your API definition file.

docs/deployment/intro.md

@@ -45,34 +45,6 @@ section in the documentation.
 
 If you want to view your Redoc output locally, you can simulate an HTTP server.
 
-#### Redocly CLI
-
-Redocly CLI is an open source command-line tool that includes a command
-for simulating an HTTP server to provide a preview of your OpenAPI definition locally.
-
-If you have [Redocly CLI](https://redocly.com/docs/cli/#installation-and-usage) installed, `cd` into your
-project directory and run the following command:
-
-```bash
-redocly preview-docs openapi.yaml
-```
-
-Replace `openapi.yaml` in the example command with the file path to your OpenAPI definition.
-
-By default, without providing a port, the preview starts on port 8080, and can be accessed at `http://localhost:8080`.
-To exit the preview, use `control+C`.
-
-You can alter the port if you are using 8080 already, for example:
-
-```bash
-redocly preview-docs -p 8888 openapi.yaml
-```
-
-Replace `openapi.yaml` in the example command with the file path to your OpenAPI definition.
-
-For more information about the `preview-docs` command, refer to
-[Redocly CLI commands](https://redocly.com/docs/cli/commands/preview-docs/#preview-docs) in the Redocly CLI documentation.
-
 #### Python
 
 If you have [Python 3](https://www.python.org/downloads/) installed, `cd` into your

docs/index.md

@@ -57,7 +57,7 @@ Check out the [deployment documentation](./deployment/intro.md) for more options
 
 Redoc is highly configurable. Each deployment option accepts configuration in a way that's appropriate to that platform, but the options are the same for each. For example:
 
-* Using [Redocly CLI](../cli/index.md), configuration goes in the `redocly.yaml` file, or can be supplied as command line parameters, such as `--theme.openapi.disableSearch`.
+* Using [Redocly CLI](../cli), configuration goes in the `redocly.yaml` file, or can be supplied as command line parameters, such as `--theme.openapi.disableSearch`.
 * Using HTML or React, configure by setting `option` in the tag.
 
 Here's a sample `redocly.yaml` configuration file, showing a few common settings and tweaking some of the visual theme settings:
@@ -85,13 +85,13 @@ theme:
 Redocly CLI detects a file named `redocly.yaml` in the same directory as you run the command and uses it. See the documentation with a command like this:
 
 ```sh
-redocly preview-docs openapi.yaml
+redocly build-docs openapi.yaml
 ```
 
 There are many, many more options available. Visit the [configuration reference](./config.md) for a complete list.
 
 ## Next steps
 
-* If you are new to OpenAPI, try the [OpenAPI starter project](../cli/openapi-starter.md) for a great introduction.
+* If you are new to OpenAPI, try the [OpenAPI starter project](../cli/openapi-starter) for a great introduction.
 * Ready to build documentation from an existing OpenAPI file? Go to the [Redoc quickstart](./quickstart.md) and get started.
 * Learn more about the project by visiting [Redoc on GitHub](https://github.com/Redocly/redoc).

docs/redoc-vendor-extensions.md

@@ -12,38 +12,39 @@ You can use the following [vendor extensions](https://redocly.com/docs/openapi-v
       - [x-tagGroups example](#x-taggroups-example)
   - [Info Object](#info-object)
     - [x-logo](#x-logo)
-      - [How to use with Redoc](#how-to-use-with-redoc-2)
+      - [How to use with Redoc](#how-to-use-with-redoc-1)
     - [Logo Object](#logo-object)
       - [Fixed fields](#fixed-fields-1)
       - [x-logo example](#x-logo-example)
   - [Tag Object](#tag-object)
     - [x-traitTag](#x-traittag)
-      - [How to use with Redoc](#how-to-use-with-redoc-3)
+      - [How to use with Redoc](#how-to-use-with-redoc-2)
       - [x-traitTag example](#x-traittag-example)
     - [x-displayName](#x-displayname)
   - [Operation Object vendor extensions](#operation-object-vendor-extensions)
     - [x-codeSamples](#x-codesamples)
-      - [How to use with Redoc](#how-to-use-with-redoc-4)
+      - [How to use with Redoc](#how-to-use-with-redoc-3)
     - [Code Sample Object](#code-sample-object)
       - [Fixed fields](#fixed-fields-2)
       - [Code Sample Object example](#code-sample-object-example)
+    - [x-badges](#x-badges)
   - [Parameter Object](#parameter-object)
     - [x-examples](#x-examples)
-      - [How to use with Redoc](#how-to-use-with-redoc-5)
+      - [How to use with Redoc](#how-to-use-with-redoc-4)
   - [Response Object vendor extensions](#response-object-vendor-extensions)
     - [x-summary](#x-summary)
-      - [How to use with Redoc](#how-to-use-with-redoc-6)
+      - [How to use with Redoc](#how-to-use-with-redoc-5)
   - [Schema Object](#schema-object)
     - [x-nullable](#x-nullable)
-      - [How to use with Redoc](#how-to-use-with-redoc-7)
+      - [How to use with Redoc](#how-to-use-with-redoc-6)
     - [x-additionalPropertiesName](#x-additionalpropertiesname)
-      - [How to use with Redoc](#how-to-use-with-redoc-9)
+      - [How to use with Redoc](#how-to-use-with-redoc-7)
       - [x-additionalPropertiesName example](#x-additionalpropertiesname-example)
     - [x-explicitMappingOnly](#x-explicitmappingonly)
-      - [How to use with Redoc](#how-to-use-with-redoc-10)
+      - [How to use with Redoc](#how-to-use-with-redoc-8)
       - [x-explicitMappingOnly example](#x-explicitmappingonly-example)
     - [x-enumDescriptions](#x-enumdescriptions)
-      - [How to use with Redoc](#how-to-use-with-redoc-11)
+      - [How to use with Redoc](#how-to-use-with-redoc-9)
       - [x-enumDescriptions example](#x-enumdescriptions-example)
 
 ## Swagger Object
@@ -67,6 +68,7 @@ Before you use `x-tagGroups`, make sure you **add all tags to a group**, since a
 #### Tag Group Object
 Information about tags group
 ##### Fixed fields
+
 | Field Name  | Type      | Description |
 | :---------- | :--------: | :---------- |
 | name        | string     | The group name |
@@ -120,6 +122,7 @@ Extends the OpenAPI [Info Object](https://redocly.com/docs/openapi-visual-refere
 The information about API logo
 
 #### Fixed fields
+
 | Field Name      | Type    | Description |
 | :-------------- | :------: | :---------- |
 | url             | string   | The URL pointing to the spec logo. MUST be in the format of a URL. It SHOULD be an absolute URL so your API definition is usable from any location |
@@ -158,6 +161,7 @@ info:
 Extends the OpenAPI [Tag Object](https://redocly.com/docs/openapi-visual-reference/tags/)
 
 ### x-traitTag
+
 | Field Name     | Type   | Description |
 | :------------- | :------: | :---------- |
 | x-traitTag     | boolean  | In Swagger two operations can have multiple tags. This property distinguishes between tags that are used to group operations (default) from tags that are used to mark operation with certain trait (`true` value) |
@@ -192,6 +196,7 @@ x-traitTag: true
 Extends the OpenAPI [Operation Object](https://redocly.com/docs/openapi-visual-reference/operation/)
 
 ### x-codeSamples
+
 | Field Name     | Type   | Description |
 | :------------- | :------: | :---------- |
 | x-codeSamples | [ [Code Sample Object](#code-sample-object) ]  | A list of code samples associated with operation |
@@ -205,6 +210,7 @@ Extends the OpenAPI [Operation Object](https://redocly.com/docs/openapi-visual-r
 Operation code sample
 
 #### Fixed fields
+
 | Field Name  | Type    | Description  |
 | :---------- | :------: | :----------- |
 | lang        | string   | Code sample language. Value should be one of the following [list](https://github.com/github/linguist/blob/master/lib/linguist/popular.yml) |
@@ -227,6 +233,7 @@ source: console.log('Hello World');
 ```
 
 ### x-badges
+
 | Field Name     | Type   | Description |
 | :------------- | :------: | :---------- |
 | x-badges | [[Badge Object](https://redocly.com/docs/realm/author/reference/openapi-extensions/x-badges#badge-object)] | A list of badges associated with the operation |
@@ -235,6 +242,7 @@ source: console.log('Hello World');
 Extends the OpenAPI [Parameter Object](https://redocly.com/docs/openapi-visual-reference/parameter/)
 
 ### x-examples
+
 | Field Name     |  Type    | Description |
 | :------------- | :------: | :---------- |
 | x-examples | [Example Object](https://redocly.com/docs/openapi-visual-reference/example/)  | Object that contains examples for the request. Applies when `in` is `body` and mime-type is `application/json` |
@@ -246,6 +254,7 @@ Extends the OpenAPI [Parameter Object](https://redocly.com/docs/openapi-visual-r
 Extends the OpenAPI [Response Object](https://redocly.com/docs/openapi-visual-reference/response/).
 
 ### x-summary
+
 | Field Name     | Type   | Description |
 | :------------- | :------: | :---------- |
 | x-summary      | string   | a short summary of the response |
@@ -257,6 +266,7 @@ If specified, you can use `x-summary` as the response button text, with descript
 Extends the OpenAPI [Schema Object](https://redocly.com/docs/openapi-visual-reference/schemas/)
 
 ### x-nullable
+
 | Field Name     | Type   | Description |
 | :------------- | :------: | :---------- |
 | x-nullable | boolean | marks schema as a nullable |
@@ -325,6 +335,7 @@ Pet:
 Shows in the selectpicker only the items `cat` and `bee`, even though the `Dog` class inherits from the `Pet` class.
 
 ### x-enumDescriptions
+
 | Field Name     | Type   | Description |
 | :------------- | :------: | :---------- |
 | x-enumDescriptions | [[Enum Description Object](https://redocly.com/docs/realm/author/reference/openapi-extensions/x-enum-descriptions#enum-description-object)] | A list of the enum values and descriptions to include in the documentation. |
@@ -350,4 +361,4 @@ components:
         event: Event Tickets _(timed entry)_
         general: General Admission
       example: event
-```
+```

package.json

@@ -1,6 +1,6 @@
 {
   "name": "redoc",
-  "version": "2.4.0",
+  "version": "2.5.2",
   "description": "ReDoc",
   "repository": {
     "type": "git",
@@ -93,7 +93,7 @@
     "cypress": "^13.8.1",
     "enzyme": "^3.11.0",
     "enzyme-to-json": "^3.6.2",
-    "esbuild-loader": "^3.0.1",
+    "esbuild-loader": "^4.3.0",
     "eslint": "^7.27.0",
     "eslint-plugin-import": "^2.23.4",
     "eslint-plugin-react": "^7.34.2",
@@ -126,7 +126,7 @@
     "url": "^0.11.1",
     "webpack": "^5.94.0",
     "webpack-cli": "^5.1.4",
-    "webpack-dev-server": "^4.15.1",
+    "webpack-dev-server": "^5.2.1",
     "webpack-node-externals": "^3.0.0",
     "workerize-loader": "github:redocly/workerize-loader#webpack-5-dist"
   },
@@ -141,14 +141,14 @@
     "@redocly/openapi-core": "^1.4.0",
     "classnames": "^2.3.2",
     "decko": "^1.2.0",
-    "dompurify": "^3.0.6",
+    "dompurify": "^3.2.4",
     "eventemitter3": "^5.0.1",
     "json-pointer": "^0.6.2",
     "lunr": "^2.3.9",
     "mark.js": "^8.11.1",
     "marked": "^4.3.0",
-    "mobx-react": "^9.1.1",
+    "mobx-react": "9.2.0",
-    "openapi-sampler": "^1.5.0",
+    "openapi-sampler": "^1.6.2",
     "path-browserify": "^1.0.1",
     "perfect-scrollbar": "^1.5.5",
     "polished": "^4.2.2",
@@ -160,6 +160,9 @@
     "swagger2openapi": "^7.0.8",
     "url-template": "^2.0.8"
   },
+  "overrides": {
+    "tmp": ">=0.2.4"
+  },
   "size-limit": [
     {
       "path": "./bundles/redoc.standalone.js",

src/components/JsonViewer/JsonViewer.tsx

@@ -41,6 +41,7 @@ const Json = (props: JsonProps) => {
         <OptionsContext.Consumer>
           {options => (
             <PrismDiv
+              tabIndex={0}
               className={props.className}
               // tslint:disable-next-line
               ref={node => setNode(node!)}

src/components/Markdown/SanitizedMdBlock.tsx

@@ -6,11 +6,14 @@ import { StylingMarkdownProps } from './Markdown';
 import { StyledMarkdownBlock } from './styled.elements';
 import styled from 'styled-components';
 
+// Workaround for DOMPurify type issues (https://github.com/cure53/DOMPurify/issues/1034)
+const dompurify = DOMPurify['default'] as DOMPurify.DOMPurify;
+
 const StyledMarkdownSpan = styled(StyledMarkdownBlock)`
   display: inline;
 `;
 
-const sanitize = (sanitize, html) => (sanitize ? DOMPurify.sanitize(html) : html);
+const sanitize = (sanitize, html) => (sanitize ? dompurify.sanitize(html) : html);
 
 export function SanitizedMarkdownHTML({
   inline,

src/components/SideMenu/MenuItem.tsx

@@ -2,14 +2,14 @@ import { observer } from 'mobx-react';
 import * as React from 'react';
 
 import { ShelfIcon } from '../../common-elements/shelfs';
+import type { IMenuItem } from '../../services';
 import { OperationModel } from '../../services';
-import { shortenHTTPVerb } from '../../utils/openapi';
-import { MenuItems } from './MenuItems';
-import { MenuItemLabel, MenuItemLi, MenuItemTitle, OperationBadge } from './styled.elements';
 import { l } from '../../services/Labels';
 import { scrollIntoViewIfNeeded } from '../../utils';
+import { shortenHTTPVerb } from '../../utils/openapi';
 import { OptionsContext } from '../OptionsProvider';
-import type { IMenuItem } from '../../services';
+import { MenuItems } from './MenuItems';
+import { MenuItemLabel, MenuItemLi, MenuItemTitle, OperationBadge } from './styled.elements';
 
 export interface MenuItemProps {
   item: IMenuItem;
@@ -47,9 +47,18 @@ export class MenuItem extends React.Component<MenuItemProps> {
       <MenuItemLi
         tabIndex={0}
         onClick={this.activate}
+        onKeyDown={evt => {
+          // Space or Enter key will activate the menu item
+          if (evt.key === 'Enter' || evt.key === ' ') {
+            this.props.onActivate!(this.props.item);
+            evt.stopPropagation();
+          }
+        }}
         depth={item.depth}
         data-item-id={item.id}
         role="menuitem"
+        aria-label={item.sidebarLabel}
+        aria-expanded={item.expanded}
       >
         {item.type === 'operation' ? (
           <OperationMenuItemContent {...this.props} item={item as OperationModel} />

src/components/__tests__/JsonViewer.tsx

@@ -2,6 +2,7 @@
 
 import { mount, ReactWrapper } from 'enzyme';
 import * as React from 'react';
+import { act } from 'react';
 
 import { JsonViewer } from '../';
 import { withTheme } from '../testProviders';
@@ -50,5 +51,54 @@ describe('Components', () => {
       expect(flatDataComponent.html()).not.toContain('Expand all');
       expect(flatDataComponent.html()).not.toContain('Collapse all');
     });
+
+    describe('Keyboard Navigation', () => {
+      let component: ReactWrapper;
+      const data = {
+        a: 1,
+        b: {
+          c:
+            // Long string to test horizontal scrolling
+            Array(100).fill('hello').join(''),
+        },
+      };
+
+      beforeEach(() => {
+        component = mount(withTheme(<JsonViewer data={data} />));
+        ClipboardService.copySelected = origCopySelected;
+      });
+
+      test('should handle arrow key navigation', () => {
+        const prismDiv = component.find('div[tabIndex=0]');
+        const divElement = prismDiv.getDOMNode();
+
+        // Mock scrollLeft before events
+        Object.defineProperty(divElement, 'scrollLeft', {
+          get: jest.fn(() => 0),
+          set: jest.fn(),
+        });
+
+        // Trigger events inside act()
+        act(() => {
+          divElement.dispatchEvent(
+            new KeyboardEvent('keydown', {
+              key: 'ArrowRight',
+              bubbles: true,
+            }),
+          );
+        });
+
+        act(() => {
+          divElement.dispatchEvent(
+            new KeyboardEvent('keydown', {
+              key: 'ArrowLeft',
+              bubbles: true,
+            }),
+          );
+        });
+
+        expect(divElement.scrollLeft).toBe(0);
+      });
+    });
   });
 });