huanld/headlessui: Completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS. - headlessui - Gitea: Git with a cup of tea

huanld/headlessui

T

Robin Malfait 6f9de8925e Disable smooth scrolling when opening/closing Dialog components on iOS (#2635 )

* disable smooth scrolling when opening/closing Dialogs

For iOS workaround related purposes we have to capture the scroll
position and offset the margin top with that amount and then
`scrollTo(0,0,)` to prevent all kinds of funny UI jumps.

However, if you have `scroll-behavior: smooth` enabled on your `html`,
then offseting the margin-top and later `scrollTo(0,0)` would be
handled in a smooth way, which means that the actual position would be
off.

To solve this, we disable smooth scrolling entirely in order to make the
position of the Dialog correct. This shouldn't be a problem in practice
since the page itself isn't suppose to scroll anyway.

Once the Dialog closes we reset it such that everything else keeps
working as expected in a (smooth) way.

* add `microTask` to disposables

* ensure the fix works in React's double rendering dev mode

* update changelog

2023-08-02 17:45:06 +02:00

include CodeSandbox links (#2488 )

2023-06-28 12:23:13 +02:00

Improve control over Menu and Listbox options while searching (#2471 )

2023-05-04 14:41:44 +02:00

Disable smooth scrolling when opening/closing Dialog components on iOS (#2635 )

2023-08-02 17:45:06 +02:00

Don't break overflow when multiple dialogs are open at the same time (#2215 )

2023-02-01 16:08:34 -05:00

.eslintignore

setup monorepo

2020-09-16 18:19:33 +02:00

.gitignore

cleanup .gitignore

2023-04-22 14:43:38 +02:00

.prettierignore

Improve overal codebase, use modern tech like esbuild and TypeScript 4! (#1055 )

2022-01-27 17:07:38 +01:00

.swcrc

Improve overal codebase, use modern tech like esbuild and TypeScript 4! (#1055 )

2022-01-27 17:07:38 +01:00

CHANGELOG.md

Split CHANGELOG.md into file per package (#1516 )

2022-05-28 18:25:41 +02:00

jest.config.cjs

convert .js to .cjs

2022-01-31 12:29:27 +01:00

LICENSE

setup monorepo

2020-09-16 18:19:33 +02:00

package.json

Make React types more compatible with other libraries (#2282 )

2023-02-20 12:26:17 -05:00

README.md

Update README.md (#2135 )

2023-01-01 06:25:25 -05:00

yarn.lock

Add Floating UI examples in combination with the Menu component (#2612 )

2023-07-25 14:45:14 +02:00

README.md

Headless UI

A set of completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.

Documentation

For full documentation, visit headlessui.com.

Installing the latest version

You can install the latest version by using:

npm install @headlessui/react@latest
npm install @headlessui/vue@latest

Installing the insiders version

You can install the insiders version (which points to whatever the latest commit on the main branch is) by using:

npm install @headlessui/react@insiders
npm install @headlessui/vue@insiders

Note: The insiders build doesn't follow semver and therefore doesn't guarantee that the APIs will be the same once they are released.

Packages

Name	Version	Downloads
`@headlessui/react`
`@headlessui/vue`
`@headlessui/tailwindcss`

Community

For help, discussion about best practices, or any other conversation that would benefit from being searchable:

Discuss Headless UI on GitHub

For casual chit-chat with others using the library:

Join the Tailwind CSS Discord Server

Contributing

If you're interested in contributing to Headless UI, please read our contributing docs before submitting a pull request.