Document file click behavior in the web editor

editor/pages.mdx

@@ -8,6 +8,14 @@
 
 Browse pages in the **Navigation** tab of the left panel. Click a page to open it. Click the search icon or press <kbd>Cmd</kbd> + <kbd>K</kbd> (macOS) or <kbd>Ctrl</kbd> + <kbd>K</kbd> (Windows) to search by filename or page content.
 
+What happens when you click a file depends on its type:
+
+- **Pages** (`.md`, `.mdx`) open in the editor for editing.
+- **Images and videos** open in a preview.
+- **`docs.json`** opens the [Configurations](/editor/configurations) panel instead of the raw file, so you can update site settings through the UI.
+- **Other text files** (like `.yml`, `.yaml`, `.json`, `.js`, `.jsx`, `.css`, `.txt`, and `.csv`) open in a read-only source view. To edit these files, update them in your code editor and push the changes to your repository.
+- **Binary and unsupported files** (like fonts, PDFs, or archives) are not clickable in the editor.
+
 <Note>
   The web editor treats API specification files (OpenAPI and AsyncAPI) as read-only. To update a spec file, edit it in your preferred code editor and push the changes to your documentation repository.
 </Note>
@@ -33,7 +41,7 @@
 - **Link to another page**: Right-click a page in the navigation tree, click **Copy link**, then paste the link into your content. The editor recognizes internal links to other pages and converts them.
 - **Insert media from your project**: Drag an image or video from the navigation tree into the page to embed it inline. Supported formats include PNG, JPG, JPEG, GIF, WebP, SVG, MP4, and WebM.
 - **Insert an emoji**: Type <kbd>:</kbd> followed by a keyword to open the emoji picker.
 - **Edit a table**: When your cursor is inside a table, use the floating toolbar to add or remove rows and columns, or merge cells.
 
 **Markdown mode** gives you direct access to the MDX source. Use it for precise control over component properties and frontmatter.
 
@@ -58,7 +66,7 @@
 
 ### Table of contents
 
 In visual mode, the editor shows a minimap on the right side of the page that reflects the heading structure of your document. Hover over the minimap to expand it into a full table of contents. Click any heading to scroll to that section.
 
 ### Code block options
 
@@ -73,7 +81,7 @@
 
 Open the publish menu and click any changed file to enter diff view. The editor highlights differences between your draft and the last published version. If you're in visual mode, you see a visual diff. If you're in Markdown mode, you see a Markdown diff.
 
 Diff view is read-only. Click the <Icon icon="x" /> button next to the mode toggle to return to editing.
 
 ## Manage pages
 
@@ -90,7 +98,7 @@
 
 Hover over a page and click the gear icon, or right-click and select **Settings**, to configure:
 
 - **Title**, **Slug**, and **Sidebar title**: Control how the page appears in navigation and its URL.
 - **Description** and **Keywords**: Improve search and SEO.
 - **Layout**: Choose from standard, wide, centered, or custom.
 
@@ -102,7 +110,7 @@
 
 Type <kbd>/image</kbd> to upload a new image or select an existing one from your repository. Type <kbd>/video</kbd> to upload or select a video.
 
 You can also drag and drop files from your computer directly onto a page. In visual mode, the file inserts inline. In Markdown mode, the editor inserts the file path at your cursor position. Images save to your `images/` folder and videos to `videos/`.
 
 To reuse media that already lives in your project, drag an image or video file from the navigation tree onto the page. The editor embeds the asset inline.