# Button Group

The Button Group component allows you to combine multiple buttons into a cohesive unit. It organizes and presents related actions in a visually appealing and user-friendly manner.

## Setting Up **Your Button Group**

### **Step 1: Enter Buttons Info:**

* **Start by adding the buttons that will make up your group.** For each button, you can customize:
  * **Label:** The text displayed on the button.
  * **Icon Name:** Choose an icon to accompany the label (optional).
  * **Variant:** Select a visual style for the button (e.g., base, neutral, brand, destructive).
  * **And more:** Explore the button properties to customize its appearance and behavior further.

### **Step 2: Display as a Row (Optional):**

* **Control the arrangement of your buttons.** By default, buttons in a group are stacked vertically. Enable the "Display as a Row" toggle to arrange them horizontally.

### **Step 3: Button Menu (Optional):**

* **Manage button visibility and optimize space.** If you have many buttons, you can use the "Button Menu" feature to create a dropdown menu that contains additional buttons. This helps keep your interface clean and organized while providing access to all available actions.
  * **Customize the Menu Button:** Configure the label, icon, and button variant that triggers the dropdown menu.
  * **Control Visible Buttons:** Specify the number of buttons that should be visible by default. Any remaining buttons will be placed in the dropdown menu.

## **Why Use the Button Group Component?**

* **Organize Actions:** Group related actions together for a more intuitive user experience.
* **Improve Visual Appeal:** Present buttons in a visually appealing and organized manner.
* **Optimize Space:** Use the menu to manage many buttons without cluttering the interface.
* **Enhance Consistency:** Maintain a consistent style and layout for buttons across your application.

## **Example Use Cases**

* **Toolbar:** Create a toolbar with buttons for common actions like "New," "Edit," "Delete," and "Save."
* **Navigation:** Group navigation buttons together for easy access to different sections of your application.
* **Form Actions:** Combine "Submit" and "Cancel" buttons in a visually cohesive unit.
* **Workflow Actions:** Present a set of actions related to a specific workflow or process.

By effectively using the Button Group component, you can create user-friendly interfaces that streamline interactions and guide users towards desired actions