Accordion

import { AXAccordionModule } from '@acorex/components/accordion';

Accordion component is a UI element that allows the creation of collapsible content sections. It enables users to toggle the visibility of content with a collapsible header, offering an intuitive and space-efficient way to organize information. With customizable features like a custom header template, accordion behavior, and event callbacks, it enhances flexibility and user interaction.

Overview

In this section, you can test different options of this component and see the output in real time

Google

Google LLC is an American multinational technology company focusing on artificial intelligence, online advertising, search engine technology, cloud computing, computer software, quantum computing, e-commerce, and consumer electronics.

Microsoft

Microsoft Corporation is an American multinational technology corporation headquartered in Redmond, Washington. Microsoft's best-known software products are the Windows line of operating systems, the Microsoft 365 suite of productivity applications, and the Edge web browser.

Apple

Apple Inc. is an American multinational technology company headquartered in Cupertino, California, in Silicon Valley. It designs, develops, and sells consumer electronics, computer software, and online services.

Look

Solid

Accordion Mode

Usage

A simple example of using accordion.

Preview

Code

Custom header template

Allows users to define a personalized header content by providing a custom template, enabling unique and flexible styling options for the collapsible panel's header section.

Preview

Code

Accordion mode

With accordion, you can only have one collapse open at a time

Preview

Code

Header Icon

With icon property, you can show icon in collapse header.

Preview

Code

Loading

With icon property, you can show icon in collapse header.

Preview

Code