Files
headlessui/packages/@headlessui-react/package.json
T
Robin Malfait 0162c57d88 add React 18 compatibility (#1326)
* bump dev dependencies to React 18

* setup Jest to include `IS_REACT_ACT_ENVIRONMENT`

* prefer `useId` from React 18 if it exists

In React 16 & 17, where `useId` doesn't exist, we will fallback to our
implementation we have been using up until now.

The `useId` exposed by React 18, ensures stable references even in SSR
environments.

* update expected events

React 18 now uses the proper events:
- `blur` -> `focusout`
- `focus` -> `focusin`

* ensure to wait a bit longer

This is a bit unfortunate, but since React 18 now does an extra
unmount/remount in `StrictMode` to ensure that your code is
ConcurrentMode ready, it takes a bit longer to settle what the DOM sees.

That said, this is a temporary "hack". We are going to experiment with
using tools like Puppeteer/Playwright to run our tests in an actual
browser instead to eliminate all the weird details that we have to keep
in mind.

* prefer `.focus()` over `fireEvent.focus(el)`

* abstract `microTask` polyfill code

* prefer our `focus(el)` function over `el.focus()`

Internally we would still use `el.focus()`, but this allows us to have
more control over that `focus` function.

* add React 18 to the React Playground

* improve hooks for React 18

- Improving the cleanup of useEffect hooks
- useIsoMorphicEffect instead of normal useEffect, so that we can use
  useLayoutEffect to be a bit quicker.

* improve disposables

- This allows us to add event listeners on a node, and get automatic
  cleanup once `dispose` gets called.
- We also return all the `d.add` calls, so that we can cleanup specific
  parts only instead of everything or nothing.

* reimplement the Transition component to be React 18 ready

* wait an additional frame for everything to settle

* update playground examples

* suppressConsoleLogs for RadioGroup components

* update changelog

* keep the `to` classes for a smoother transition

In the next transition we will remove _all_ classes provided and re-add
the once we need.

---

Some extra special thanks:

- Thanks @silvenon for your initial work on the `transition` events in #926
- Thanks @thecrypticace for doing late-night debugging sessions

Co-authored-by: =?UTF-8?q?Matija=20Marohni=C4=87?= <matija.marohnic@gmail.com>
Co-authored-by: Jordan Pittman <jordan@cryptica.me>
2022-04-13 22:07:01 +02:00

54 lines
1.5 KiB
JSON

{
"name": "@headlessui/react",
"version": "1.5.0",
"description": "A set of completely unstyled, fully accessible UI components for React, designed to integrate beautifully with Tailwind CSS.",
"main": "dist/index.cjs",
"typings": "dist/index.d.ts",
"module": "dist/headlessui.esm.js",
"license": "MIT",
"files": [
"README.md",
"dist"
],
"exports": {
"import": "./dist/headlessui.esm.js",
"require": "./dist/index.cjs",
"types": "./dist/index.d.ts"
},
"type": "module",
"sideEffects": false,
"engines": {
"node": ">=10"
},
"repository": {
"type": "git",
"url": "git+https://github.com/tailwindlabs/headlessui.git",
"directory": "packages/@headlessui-react"
},
"publishConfig": {
"access": "public"
},
"scripts": {
"prepublishOnly": "npm run build",
"build": "../../scripts/build.sh --external:react --external:react-dom",
"watch": "../../scripts/watch.sh --external:react --external:react-dom",
"test": "../../scripts/test.sh",
"lint": "../../scripts/lint.sh",
"playground": "yarn workspace playground-react dev",
"clean": "rimraf ./dist"
},
"peerDependencies": {
"react": "^16 || ^17 || ^18",
"react-dom": "^16 || ^17 || ^18"
},
"devDependencies": {
"@testing-library/react": "^13.0.0",
"@types/react": "^17.0.43",
"@types/react-dom": "^17.0.14",
"esbuild": "^0.11.18",
"react": "^18.0.0",
"react-dom": "^18.0.0",
"snapshot-diff": "^0.8.1"
}
}