Conversation
| @@ -3,7 +3,7 @@ | |||
| */ | |||
| import type { ForwardedRef } from 'react'; | |||
| // eslint-disable-next-line no-restricted-imports | |||
There was a problem hiding this comment.
We should be able to remove this ESlint comment?
There was a problem hiding this comment.
Good observation! Actually that comment is correct, because we normally folks shouldn't be able to import directly from ariakit (they should use the library through the @wordpress/components package) — or at least, this was the deal with reakit, and I believe that at least for now, we should apply to ariakit too.
I went ahead and updated the ESLint config to disallow ariakit imports, and consequently added more "disable" comments where needed in the components package.
9406f6a to
78bd548
Compare
|
Size Change: +5 B (0%) Total Size: 1.62 MB
ℹ️ View Unchanged
|
diegohaz
left a comment
There was a problem hiding this comment.
This looks good to me 👍🏽
I'll just mention that, in terms of bundling for production, there's no difference between the various methods of importing Ariakit. All of these are equivalent:
import * as Ariakit from "@ariakit/react";
import { Checkbox } from "@ariakit/react";
import * as Ariakit from "@ariakit/react/checkbox";
import { Checkbox } from "@ariakit/react/checkbox";In fact, Checkbox and Ariakit.Checkbox will be identical in all these instances (Checkbox === Ariakit.Checkbox). Therefore, the style you choose doesn't really matter in this situation.
Except for: the namespace import offers the benefit of name scoping, and importing from a specific path (@ariakit/react/checkbox) might potentially be faster during development. But I haven't verified this yet, and even if it's true, I expect the difference to be negligible.
|
Warning: Type of PR label error To merge this PR, it requires exactly 1 label indicating the type of PR. Other labels are optional and not being checked here.
Read more about Type labels in Gutenberg. |
What?
Refactor the code to follow ariakit best practices
Why?
We should aim at using third-party dependencies the way they are intended.
While working on #54612 I stumbled upon some console warning — this PR aims at fixing them so that when we upgrade to a more recent version of ariakit, those warnings will be gone.
How?
renderprop instead of theasprop (which has been deprecated in one of the latest release) (docs)import * as Ariakit from '@ariakit/react'statement for all imports, instead of importing the specific sub-folder (docs)Testing Instructions
No changes are expected at runtime, all affected components should continue to work as previously.
All tests keep passing.