open-index/open-npm huggingface dataset:
npm package: @headlessui-float/nuxt
Description: Easily use Headless UI for Nuxt 3 with Floating UI (Popper.js)
Latest version: 0.15.1

<h2 align="center">Headless UI Float Nuxt</h2>

<p align="center">
  Easily use <a href="https://headlessui.com/">Headless UI</a> for Nuxt 3 with <a href="https://floating-ui.com/">Floating UI</a> (New version Popper.js) to position floating elements.
</p>

<p align="center">
  <a href="https://www.npmjs.com/package/@headlessui-float/nuxt"><img src="https://img.shields.io/npm/v/@headlessui-float/nuxt?style=flat-square" alt="NPM Version"></a>
  <a href="https://github.com/ycs77/headlessui-float/blob/main/packages/nuxt/LICENSE.md"><img src="https://img.shields.io/badge/license-MIT-brightgreen?style=flat-square" alt="Software License"></a>
  <a href="https://www.npmjs.com/package/@headlessui-float/nuxt"><img src="https://img.shields.io/npm/dt/@headlessui-float/nuxt?style=flat-square" alt="NPM Downloads"></a>
</p>

<hr>

> [!WARNING]
> This package is unmaintained due to lack of time. It should mostly work but do not expect fixes or new features.

> [!NOTE]
> [Headless UI](https://headlessui.com/) has [released version 2.0](https://tailwindcss.com/blog/headless-ui-v2#built-in-anchor-positioning) (currently for React only), which builds in anchor positioning with Floating UI. Therefore, this package will be unnecessary when Headless UI v2 supports Vue.

## Features

* 💙 Easily use Headless UI & Tailwind CSS
* 💬 Floating UI (New version Popper.js) position floating elements
* 🔔 Auto-update floating elements
* ♾️ Support Transition
* 🚪 Support Portal (Teleport)
* ➡️ Support Arrow

## Documentation

[Documentation](https://headlessui-float.vercel.app/) | [繁體中文文檔](https://headlessui-float.vercel.app/zh-tw/)

## Sponsor

If you think this package has helped you, please consider [Becoming a sponsor](https://www.patreon.com/ycs77) to support my work~ and your avatar will be visible on my major projects.

<p align="center">
  <a href="https://www.patreon.com/ycs77">
    <img src="https://cdn.jsdelivr.net/gh/ycs77/static/sponsors.svg"/>
  </a>
</p>

<a href="https://www.patreon.com/ycs77">
  <img src="https://c5.patreon.com/external/logo/become_a_patron_button.png" alt="Become a Patron" />
</a>

## Credits

* [Headless UI](https://headlessui.com/)
* [Floating UI](https://floating-ui.com/)
* This package is inspired by the [headlessui#154 example](https://github.com/tailwindlabs/headlessui/issues/154)

## License

Under the [MIT LICENSE](LICENSE.md)
npm package: @headlessui-float/react
Description: Easily use Headless UI for React with Floating UI (Popper.js)
Latest version: 0.15.1

<h2 align="center">Headless UI Float React</h2>

<p align="center">
  Easily use <a href="https://headlessui.com/">Headless UI</a> for React with <a href="https://floating-ui.com/">Floating UI</a> (New version Popper.js) to position floating elements.
</p>

<p align="center">
  <a href="https://www.npmjs.com/package/@headlessui-float/react"><img src="https://img.shields.io/npm/v/@headlessui-float/react?style=flat-square" alt="NPM Version"></a>
  <a href="https://github.com/ycs77/headlessui-float/blob/main/packages/react/LICENSE.md"><img src="https://img.shields.io/badge/license-MIT-brightgreen?style=flat-square" alt="Software License"></a>
  <a href="https://www.npmjs.com/package/@headlessui-float/react"><img src="https://img.shields.io/npm/dt/@headlessui-float/react?style=flat-square" alt="NPM Downloads"></a>
</p>

<hr>

> [!WARNING]
> This package is unmaintained due to lack of time. It should mostly work but do not expect fixes or new features.

> [!NOTE]
> [Headless UI](https://headlessui.com/) has [released version 2.0](https://tailwindcss.com/blog/headless-ui-v2#built-in-anchor-positioning) (currently for React only), which builds in anchor positioning with Floating UI, making this package unnecessary.

## Features

* 💙 Easily use Headless UI & Tailwind CSS
* 💬 Floating UI (New version Popper.js) position floating elements
* 🔔 Auto-update floating elements
* ♾️ Support Transition
* 🚪 Support Portal
* ➡️ Support Arrow

## Demo

[**Online Demo**](https://stackblitz.com/github/ycs77/headlessui-float/tree/main/examples/example-react?file=src%2FApp.jsx)

## Documentation

[Documentation](https://headlessui-float.vercel.app/) | [繁體中文文檔](https://headlessui-float.vercel.app/zh-tw/)

## Sponsor

If you think this package has helped you, please consider [Becoming a sponsor](https://www.patreon.com/ycs77) to support my work~ and your avatar will be visible on my major projects.

<p align="center">
  <a href="https://www.patreon.com/ycs77">
    <img src="https://cdn.jsdelivr.net/gh/ycs77/static/sponsors.svg"/>
  </a>
</p>

<a href="https://www.patreon.com/ycs77">
  <img src="https://c5.patreon.com/external/logo/become_a_patron_button.png" alt="Become a Patron" />
</a>

## Credits

* [Headless UI](https://headlessui.com/)
* [Floating UI](https://floating-ui.com/)
* This package is inspired by the [headlessui#154 example](https://github.com/tailwindlabs/headlessui/issues/154)

## License

Under the [MIT LICENSE](LICENSE.md)
npm package: @headlessui-float/vue
Description: Easily use Headless UI for Vue 3 with Floating UI (Popper.js)
Latest version: 0.15.1

<h2 align="center">Headless UI Float Vue</h2>

<p align="center">
  Easily use <a href="https://headlessui.com/">Headless UI</a> for Vue 3 with <a href="https://floating-ui.com/">Floating UI</a> (New version Popper.js) to position floating elements.
</p>

<p align="center">
  <a href="https://www.npmjs.com/package/@headlessui-float/vue"><img src="https://img.shields.io/npm/v/@headlessui-float/vue?style=flat-square" alt="NPM Version"></a>
  <a href="https://github.com/ycs77/headlessui-float/blob/main/packages/vue/LICENSE.md"><img src="https://img.shields.io/badge/license-MIT-brightgreen?style=flat-square" alt="Software License"></a>
  <a href="https://www.npmjs.com/package/@headlessui-float/vue"><img src="https://img.shields.io/npm/dt/@headlessui-float/vue?style=flat-square" alt="NPM Downloads"></a>
</p>

<hr>

> [!WARNING]
> This package is unmaintained due to lack of time. It should mostly work but do not expect fixes or new features.

> [!NOTE]
> [Headless UI](https://headlessui.com/) has [released version 2.0](https://tailwindcss.com/blog/headless-ui-v2#built-in-anchor-positioning) (currently for React only), which builds in anchor positioning with Floating UI. Therefore, this package will be unnecessary when Headless UI v2 supports Vue.

## Features

* 💙 Easily use Headless UI & Tailwind CSS
* 💬 Floating UI (New version Popper.js) position floating elements
* 🔔 Auto-update floating elements
* ♾️ Support Transition
* 🚪 Support Portal (Teleport)
* ➡️ Support Arrow

## Demo

[**Online Demo**](https://stackblitz.com/github/ycs77/headlessui-float/tree/main/examples/example-vue?file=src%2FApp.vue)

## Documentation

[Documentation](https://headlessui-float.vercel.app/) | [繁體中文文檔](https://headlessui-float.vercel.app/zh-tw/)

## Sponsor

If you think this package has helped you, please consider [Becoming a sponsor](https://www.patreon.com/ycs77) to support my work~ and your avatar will be visible on my major projects.

<p align="center">
  <a href="https://www.patreon.com/ycs77">
    <img src="https://cdn.jsdelivr.net/gh/ycs77/static/sponsors.svg"/>
  </a>
</p>

<a href="https://www.patreon.com/ycs77">
  <img src="https://c5.patreon.com/external/logo/become_a_patron_button.png" alt="Become a Patron" />
</a>

## Credits

* [Headless UI](https://headlessui.com/)
* [Floating UI](https://floating-ui.com/)
* This package is inspired by the [headlessui#154 example](https://github.com/tailwindlabs/headlessui/issues/154)

## License

Under the [MIT LICENSE](LICENSE.md)
npm package: @headlessui/react
Description: A set of completely unstyled, fully accessible UI components for React, designed to integrate beautifully with Tailwind CSS.
Latest version: 2.2.10

<h3 align="center">
  @headlessui/react
</h3>

<p align="center">
  A set of completely unstyled, fully accessible UI components for React, designed to integrate
  beautifully with Tailwind CSS.
</p>

<p align="center">
  <a href="https://www.npmjs.com/package/@headlessui/react"><img src="https://img.shields.io/npm/dt/@headlessui/react.svg" alt="Total Downloads"></a>
  <a href="https://github.com/tailwindlabs/headlessui/releases"><img src="https://img.shields.io/npm/v/@headlessui/react.svg" alt="Latest Release"></a>
  <a href="https://github.com/tailwindlabs/headlessui/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/@headlessui/react.svg" alt="License"></a>
</p>

## Installation

```sh
npm install @headlessui/react
```

## Documentation

For full documentation, visit [headlessui.dev](https://headlessui.dev/react/menu).

## Community

For help, discussion about best practices, or feature ideas:

[Discuss Headless UI on GitHub](https://github.com/tailwindlabs/headlessui/discussions)
npm package: @headlight/babel-preset-cosmos
Description: babel preset to use cosmos
Author: siddharthkp
Latest version: 0.2.9

<img src="/assets/cosmos.png">

&nbsp;&nbsp;

#### Babel preset for Headlight Studios Design System

&nbsp;&nbsp;

#### [👉 Start here 👈](https://auth0-cosmos.now.sh/docs)

&nbsp;&nbsp;
npm package: @headlight/cosmos
Description: Component library for Headlight Studios Design System
Author: auth0
Latest version: 0.2.9

<img src="/assets/cosmos.png">

&nbsp;&nbsp;

#### Headlight Studios Design System

&nbsp;&nbsp;

#### [👉 Start here 👈](https://auth0-cosmos.now.sh/docs)

&nbsp;&nbsp;

> “Set of shared and integrated principles and patterns that define the overall design of a product.” — Karri Saarinen @ Airbnb

&nbsp;
npm package: @headlight/cosmos-tokens
Description: Tokens for Headlight Studios Design System
Author: auth0
Latest version: 0.2.9

<img src="/assets/cosmos.png">

&nbsp;&nbsp;

#### Tokens for Headlight Studios Design System

&nbsp;&nbsp;

#### [👉 Start here 👈](https://auth0-cosmos.now.sh/docs)

&nbsp;&nbsp;