import { ArgTypes, Title, Subtitle } from '@storybook/addon-docs';

<div className="bq-doc__wrapper" data-theme="light">
  <div className="bq-doc__container" >
    <Title>Side Menu</Title>

    Menus are commonly used in user interfaces to provide a hierarchical navigation structure, providing users with a clear and intuitive way to navigate and interact with their application.
    The Side Menu Component typically consists of a list of links or icons that allow users to access various sections, pages, or functionalities of an application. It remains collapsed by default and can be triggered to expand or slide in by clicking the footer button.

    <Subtitle>Usage</Subtitle>

    The purpose of a Side Menu Component is to offer a consistent and accessible way for users to navigate through an application's content or perform specific actions. It allows users to quickly switch between different sections or views without cluttering the main screen or disrupting the workflow.
    Side menus are commonly used in applications with complex hierarchies or a large number of features, such as dashboards, admin panels, or content-heavy applications.
    It can be used as the main navigation for the application or as a secondary navigation for specific sections of the application.

    <Subtitle>Accessibility</Subtitle>

    The Side Menu Component is accessible to all users, including those with disabilities or who use assistive technologies. It's navigable using the keyboard and includes appropriate ARIA attributes to indicate the menu's role and state.

    <Title>Properties</Title>

    <Subtitle>bq-side-menu</Subtitle>

    <ArgTypes of="bq-side-menu" />

    <Subtitle>bq-side-menu-item</Subtitle>

    <ArgTypes of="bq-side-menu-item" />
  </div>
</div>
