Skip to content

Make sidebar collapsible on clicking label not just arrows #10854

Closed
@aaryanporwal

Description

@aaryanporwal

Have you read the Contributing Guidelines on issues?

Prerequisites

  • I'm using the latest version of Docusaurus.
  • I have tried the npm run clear or yarn clear command.
  • I have tried rm -rf node_modules yarn.lock package-lock.json and re-installing packages.
  • I have tried creating a repro with https://new.docusaurus.io.
  • I have read the console error message carefully (if applicable).

Description

In the sidebar, is there any way to make the accordions collapsible on clicking label? It's possible to expand the accordion on first click, but on clicking an expanded accordion should collapse it. Currently, the user has to click on the accordion arrow to collapse it.

In the following video, I've attached the docusaurus docs page where the bug can be seen. I'm not sure if this is an intended thing, but seems odd UX-wise.

Screen.Recording.2025-01-21.at.2.22.15.PM.mov

Reproducible demo

No response

Steps to reproduce

1.	Open the Docusaurus docs page in a browser.
2.	Navigate to the sidebar containing accordions.
3.	Click on the label of an accordion to expand it.
4.	Click on the same accordion label again to attempt to collapse it.

Expected behavior

Clicking on an expanded accordion’s label should collapse it, providing a toggle behavior directly through the label.

Actual behavior

Clicking on the label of an expanded accordion does not collapse it. The user must click on the accordion arrow to collapse it, which results in inconsistent user experience.

Your environment

Self-service

  • I'd be willing to fix this bug myself.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugAn error in the Docusaurus core causing instability or issues with its execution

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions