---
title: "Integration with headless UI libraries"
label: "Headless UI"
id: "guide:headless-integration"
---

## Overview

Because components in `@camome/core` are expected to be built without event handlers or `useEffect`, complex UIs that require run-time JavaScript, like popups, are out of scope. Components such as [Tab](https://chat.openai.com/docs/components/data-display/tab) and [Menu](https://chat.openai.com/docs/components/overlay/menu) provide only HTML structure and CSS styles. It is your responsibility to make them functional.

However, since this can be cumbersome, it is recommended to use a headless UI library that takes care of the non-visual aspects of the components to save your time.

For React, some popular libraries are:

- [Headless UI](https://headlessui.com/)
- [React Aria](https://react-spectrum.adobe.com/react-aria/)
- [Radix Primitives](https://www.radix-ui.com/)
- [Reach UI](https://reach.tech/)

For components that require integration with an external library, sample codes using [Headless UI](https://headlessui.com/) are provided in the docs. Of course, other libraries or writing your own are just fine.
