Multiple Versions of Tabbable Found

[emilyrohrbough]

Feature Request

Description

We use focus-trap-react in multiple terra-components (terra-overlay, popup) This in turn pulls in focus-trap, which pulls in tabbable v3.1.2.

We use tabbable v4 directly in terra-overlay so we are seeing the following duplicate dependency warning on build:

[lokesh-0813]

Feature Request

Description

We use focus-trap-react in multiple terra-components (terra-overlay, popup) This in turn pulls in focus-trap, which pulls in tabbable v3.1.2.

We use tabbable v4 directly in terra-overlay so we are seeing the following duplicate dependency warning on build:

@emilyrohrbough you are right, focus-trap-react calls focus-trap which in turn calls tabbable V3.1.2 .

The warning is encountered because terra-layout package in terra-framework directly calls tabbable V4.

Did some backtracking and noticed that in terra-layout the version was changed from v 3.1.1 to v 4.0.0 by @bjankord few weeks ago. Perhaps Brett could give more information on this.

Also the focus-trap-react we use is V 6.0.0 which calls focus-trap V 4.0.2 which calls tabbable V 3.1.2

Note : focus-trap V 5.0.0 uses tabbable V 4.0.0. focus-trap-react does not use V5.0.0 of focus-trap at this moment.

[emilyrohrbough]

FYI: I've logged this issue: focus-trap/focus-trap-react#46

[bjankord]

I don't forsee that issue being addressed anytime soon. The maintainer is looking for other people to help maintain focus-trap-react. I looked at updating focus-trap-react to focus-trap v5 which would resolve the issue and the tests failed. I didn't want to get into restructuring the tests on focus-trap-react so I haven't looked into it any more. It also looks like there are a fair amount of dev dependencies that need update in focus-trap-react.

With the react team working on reactjs/rfcs#109 and react-events, we'll hopefully get to a point where maybe we don't need to depend of third-party focus management libraries and those concerns will be handled directly in reactjs.

Until then, I recommend we continue to use tabbable, it is a solid library. However, I do think we should look at options to replace focus-trap-react.

This library looks like an interesting alternative:

• https://github.com/theKashey/react-focus-lock

[stale]

This issue has been automatically marked as inactive because it has not had recent activity. It will be closed in seven days if no further activity occurs. Thank you for your contributions.