focus-trap-react 11.0.1 β†’ 11.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # Changelog
2
2
 
3
+ ## 11.0.2
4
+
5
+ ### Patch Changes
6
+
7
+ - e766841: Fix deprecation warning in React 19 when accessing ref the pre-v19 way
8
+
3
9
  ## 11.0.1
4
10
 
5
11
  ### Patch Changes
package/README.md CHANGED
@@ -1,7 +1,7 @@
1
1
  # focus-trap-react [![CI](https://github.com/focus-trap/focus-trap-react/workflows/CI/badge.svg?branch=master&event=push)](https://github.com/focus-trap/focus-trap-react/actions?query=workflow:CI+branch:master) [![Codecov](https://img.shields.io/codecov/c/github/focus-trap/focus-trap-react)](https://codecov.io/gh/focus-trap/focus-trap-react) [![license](https://badgen.now.sh/badge/license/MIT)](./LICENSE)
2
2
 
3
3
  <!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->
4
- [![All Contributors](https://img.shields.io/badge/all_contributors-29-orange.svg?style=flat-square)](#contributors)
4
+ [![All Contributors](https://img.shields.io/badge/all_contributors-30-orange.svg?style=flat-square)](#contributors)
5
5
  <!-- ALL-CONTRIBUTORS-BADGE:END -->
6
6
 
7
7
  A React component that traps focus.
@@ -348,32 +348,33 @@ In alphabetical order:
348
348
  </tr>
349
349
  <tr>
350
350
  <td align="center" valign="top" width="14.28%"><a href="https://github.com/features/security"><img src="https://avatars1.githubusercontent.com/u/27347476?v=4?s=100" width="100px;" alt="Dependabot"/><br /><sub><b>Dependabot</b></sub></a><br /><a href="#maintenance-dependabot" title="Maintenance">🚧</a></td>
351
+ <td align="center" valign="top" width="14.28%"><a href="https://github.com/VercammenJens"><img src="https://avatars.githubusercontent.com/u/19661051?v=4?s=100" width="100px;" alt="Jens Vercammen"/><br /><sub><b>Jens Vercammen</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/issues?q=author%3AVercammenJens" title="Bug reports">πŸ›</a></td>
351
352
  <td align="center" valign="top" width="14.28%"><a href="https://github.com/jhnns"><img src="https://avatars.githubusercontent.com/u/781746?v=4?s=100" width="100px;" alt="Johannes Ewald"/><br /><sub><b>Johannes Ewald</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/commits?author=jhnns" title="Code">πŸ’»</a></td>
352
353
  <td align="center" valign="top" width="14.28%"><a href="http://josuzuki.me"><img src="https://avatars1.githubusercontent.com/u/9583920?v=4?s=100" width="100px;" alt="Jonathan Suzuki"/><br /><sub><b>Jonathan Suzuki</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/issues?q=author%3AJoSuzuki" title="Bug reports">πŸ›</a></td>
353
354
  <td align="center" valign="top" width="14.28%"><a href="http://reload.dk"><img src="https://avatars.githubusercontent.com/u/73966?v=4?s=100" width="100px;" alt="Kasper GarnΓ¦s"/><br /><sub><b>Kasper GarnΓ¦s</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/issues?q=author%3Akasperg" title="Bug reports">πŸ›</a></td>
354
355
  <td align="center" valign="top" width="14.28%"><a href="http://kathleenmcmahon.dev/"><img src="https://avatars1.githubusercontent.com/u/11621935?v=4?s=100" width="100px;" alt="Kathleen McMahon"/><br /><sub><b>Kathleen McMahon</b></sub></a><br /><a href="#maintenance-resource11" title="Maintenance">🚧</a></td>
355
356
  <td align="center" valign="top" width="14.28%"><a href="https://github.com/LoganDark"><img src="https://avatars.githubusercontent.com/u/4723091?v=4?s=100" width="100px;" alt="LoganDark"/><br /><sub><b>LoganDark</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/issues?q=author%3ALoganDark" title="Bug reports">πŸ›</a></td>
356
- <td align="center" valign="top" width="14.28%"><a href="https://marais.io/"><img src="https://avatars2.githubusercontent.com/u/599459?v=4?s=100" width="100px;" alt="Marais Rossouw"/><br /><sub><b>Marais Rossouw</b></sub></a><br /><a href="#infra-maraisr" title="Infrastructure (Hosting, Build-Tools, etc)">πŸš‡</a></td>
357
357
  </tr>
358
358
  <tr>
359
+ <td align="center" valign="top" width="14.28%"><a href="https://marais.io/"><img src="https://avatars2.githubusercontent.com/u/599459?v=4?s=100" width="100px;" alt="Marais Rossouw"/><br /><sub><b>Marais Rossouw</b></sub></a><br /><a href="#infra-maraisr" title="Infrastructure (Hosting, Build-Tools, etc)">πŸš‡</a></td>
359
360
  <td align="center" valign="top" width="14.28%"><a href="https://github.com/Mathias-S"><img src="https://avatars.githubusercontent.com/u/225531?v=4?s=100" width="100px;" alt="Mathias Stang"/><br /><sub><b>Mathias Stang</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/issues?q=author%3AMathias-S" title="Bug reports">πŸ›</a> <a href="https://github.com/focus-trap/focus-trap-react/pulls?q=is%3Apr+reviewed-by%3AMathias-S" title="Reviewed Pull Requests">πŸ‘€</a></td>
360
361
  <td align="center" valign="top" width="14.28%"><a href="https://github.com/StackOverflowIsBetterThanAnyAI"><img src="https://avatars.githubusercontent.com/u/140268904?v=4?s=100" width="100px;" alt="Michael"/><br /><sub><b>Michael</b></sub></a><br /><a href="#example-StackOverflowIsBetterThanAnyAI" title="Examples">πŸ’‘</a></td>
361
362
  <td align="center" valign="top" width="14.28%"><a href="https://www.moroshko.me"><img src="https://avatars.githubusercontent.com/u/259753?v=4?s=100" width="100px;" alt="Misha Moroshko"/><br /><sub><b>Misha Moroshko</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/issues?q=author%3Amoroshko" title="Bug reports">πŸ›</a></td>
362
363
  <td align="center" valign="top" width="14.28%"><a href="https://github.com/liunate"><img src="https://avatars2.githubusercontent.com/u/38996291?v=4?s=100" width="100px;" alt="Nate Liu"/><br /><sub><b>Nate Liu</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/commits?author=liunate" title="Tests">⚠️</a></td>
363
364
  <td align="center" valign="top" width="14.28%"><a href="https://www.linkedin.com/in/rivajunior/"><img src="https://avatars1.githubusercontent.com/u/11370172?v=4?s=100" width="100px;" alt="Rivaldo Junior"/><br /><sub><b>Rivaldo Junior</b></sub></a><br /><a href="#maintenance-rivajunior" title="Maintenance">🚧</a></td>
364
365
  <td align="center" valign="top" width="14.28%"><a href="https://scottrippey.github.io/"><img src="https://avatars3.githubusercontent.com/u/430608?v=4?s=100" width="100px;" alt="Scott Rippey"/><br /><sub><b>Scott Rippey</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/commits?author=scottrippey" title="Code">πŸ’»</a> <a href="https://github.com/focus-trap/focus-trap-react/issues?q=author%3Ascottrippey" title="Bug reports">πŸ›</a></td>
365
- <td align="center" valign="top" width="14.28%"><a href="https://seanmcp.com/"><img src="https://avatars1.githubusercontent.com/u/6360367?v=4?s=100" width="100px;" alt="Sean McPherson"/><br /><sub><b>Sean McPherson</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/commits?author=SeanMcP" title="Code">πŸ’»</a></td>
366
366
  </tr>
367
367
  <tr>
368
+ <td align="center" valign="top" width="14.28%"><a href="https://seanmcp.com/"><img src="https://avatars1.githubusercontent.com/u/6360367?v=4?s=100" width="100px;" alt="Sean McPherson"/><br /><sub><b>Sean McPherson</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/commits?author=SeanMcP" title="Code">πŸ’»</a></td>
368
369
  <td align="center" valign="top" width="14.28%"><a href="http://smoores.dev"><img src="https://avatars.githubusercontent.com/u/5354254?v=4?s=100" width="100px;" alt="Shane Moore"/><br /><sub><b>Shane Moore</b></sub></a><br /><a href="#platform-SMores" title="Packaging/porting to new platform">πŸ“¦</a></td>
369
370
  <td align="center" valign="top" width="14.28%"><a href="https://recollectr.io"><img src="https://avatars2.githubusercontent.com/u/6835891?v=4?s=100" width="100px;" alt="Slapbox"/><br /><sub><b>Slapbox</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/commits?author=Slapbox" title="Documentation">πŸ“–</a> <a href="https://github.com/focus-trap/focus-trap-react/issues?q=author%3ASlapbox" title="Bug reports">πŸ›</a></td>
370
371
  <td align="center" valign="top" width="14.28%"><a href="https://stefancameron.com/"><img src="https://avatars3.githubusercontent.com/u/2855350?v=4?s=100" width="100px;" alt="Stefan Cameron"/><br /><sub><b>Stefan Cameron</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/commits?author=stefcameron" title="Code">πŸ’»</a> <a href="https://github.com/focus-trap/focus-trap-react/issues?q=author%3Astefcameron" title="Bug reports">πŸ›</a> <a href="#infra-stefcameron" title="Infrastructure (Hosting, Build-Tools, etc)">πŸš‡</a> <a href="https://github.com/focus-trap/focus-trap-react/commits?author=stefcameron" title="Tests">⚠️</a> <a href="https://github.com/focus-trap/focus-trap-react/commits?author=stefcameron" title="Documentation">πŸ“–</a> <a href="#maintenance-stefcameron" title="Maintenance">🚧</a></td>
371
372
  <td align="center" valign="top" width="14.28%"><a href="http://tylerhawkins.info/201R/"><img src="https://avatars0.githubusercontent.com/u/13806458?v=4?s=100" width="100px;" alt="Tyler Hawkins"/><br /><sub><b>Tyler Hawkins</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/commits?author=thawkin3" title="Documentation">πŸ“–</a> <a href="#example-thawkin3" title="Examples">πŸ’‘</a> <a href="https://github.com/focus-trap/focus-trap-react/commits?author=thawkin3" title="Tests">⚠️</a> <a href="#tool-thawkin3" title="Tools">πŸ”§</a></td>
372
373
  <td align="center" valign="top" width="14.28%"><a href="https://github.com/wandroll"><img src="https://avatars.githubusercontent.com/u/4492317?v=4?s=100" width="100px;" alt="Wandrille Verlut"/><br /><sub><b>Wandrille Verlut</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/commits?author=wandroll" title="Code">πŸ’»</a> <a href="https://github.com/focus-trap/focus-trap-react/commits?author=wandroll" title="Tests">⚠️</a></td>
373
374
  <td align="center" valign="top" width="14.28%"><a href="https://github.com/krikienoid"><img src="https://avatars3.githubusercontent.com/u/8528227?v=4?s=100" width="100px;" alt="krikienoid"/><br /><sub><b>krikienoid</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/issues?q=author%3Akrikienoid" title="Bug reports">πŸ›</a></td>
374
- <td align="center" valign="top" width="14.28%"><a href="https://github.com/robert-westenberger"><img src="https://avatars.githubusercontent.com/u/44252092?v=4?s=100" width="100px;" alt="robert-westenberger"/><br /><sub><b>robert-westenberger</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/commits?author=robert-westenberger" title="Documentation">πŸ“–</a> <a href="https://github.com/focus-trap/focus-trap-react/issues?q=author%3Arobert-westenberger" title="Bug reports">πŸ›</a></td>
375
375
  </tr>
376
376
  <tr>
377
+ <td align="center" valign="top" width="14.28%"><a href="https://github.com/robert-westenberger"><img src="https://avatars.githubusercontent.com/u/44252092?v=4?s=100" width="100px;" alt="robert-westenberger"/><br /><sub><b>robert-westenberger</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/commits?author=robert-westenberger" title="Documentation">πŸ“–</a> <a href="https://github.com/focus-trap/focus-trap-react/issues?q=author%3Arobert-westenberger" title="Bug reports">πŸ›</a></td>
377
378
  <td align="center" valign="top" width="14.28%"><a href="https://github.com/syntactic-salt"><img src="https://avatars.githubusercontent.com/u/9385662?v=4?s=100" width="100px;" alt="syntactic-salt"/><br /><sub><b>syntactic-salt</b></sub></a><br /><a href="https://github.com/focus-trap/focus-trap-react/issues?q=author%3Asyntactic-salt" title="Bug reports">πŸ›</a></td>
378
379
  </tr>
379
380
  </tbody>
@@ -1,6 +1,7 @@
1
1
  "use strict";
2
2
 
3
3
  function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
4
+ var _exec$, _exec;
4
5
  function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
5
6
  function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
6
7
  function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
@@ -20,6 +21,12 @@ var _require = require('focus-trap'),
20
21
  var _require2 = require('tabbable'),
21
22
  isFocusable = _require2.isFocusable;
22
23
 
24
+ /**
25
+ * The major version of React currently running.
26
+ * @type {number}
27
+ */
28
+ var reactVerMajor = parseInt((_exec$ = (_exec = /^(\d+)\./.exec(React.version)) === null || _exec === void 0 ? void 0 : _exec[1]) !== null && _exec$ !== void 0 ? _exec$ : 0, 10);
29
+
23
30
  /**
24
31
  * @type {import('../index.d.ts').FocusTrap}
25
32
  */
@@ -373,10 +380,21 @@ var FocusTrap = /*#__PURE__*/function (_React$Component) {
373
380
  var callbackRef = function callbackRef(element) {
374
381
  var containerElements = _this3.props.containerElements;
375
382
  if (child) {
376
- if (typeof child.ref === 'function') {
377
- child.ref(element);
378
- } else if (child.ref) {
379
- child.ref.current = element;
383
+ // React 19 moved the `ref` to an official prop
384
+ if (reactVerMajor >= 19) {
385
+ if (typeof child.props.ref === 'function') {
386
+ child.props.ref(element);
387
+ } else if (child.props.ref) {
388
+ child.props.ref.current = element;
389
+ }
390
+ } else {
391
+ // older versions of React had the `ref` separate from props (still works in R19
392
+ // but results in a deprecation warning in Dev builds)
393
+ if (typeof child.ref === 'function') {
394
+ child.ref(element);
395
+ } else if (child.ref) {
396
+ child.ref.current = element;
397
+ }
380
398
  }
381
399
  }
382
400
  _this3.focusTrapElements = containerElements ? containerElements : [element];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "focus-trap-react",
3
- "version": "11.0.1",
3
+ "version": "11.0.2",
4
4
  "description": "A React component that traps focus.",
5
5
  "main": "dist/focus-trap-react.js",
6
6
  "types": "index.d.ts",
@@ -63,34 +63,34 @@
63
63
  "@babel/plugin-proposal-class-properties": "^7.18.6",
64
64
  "@babel/preset-env": "^7.26.0",
65
65
  "@babel/preset-react": "^7.26.3",
66
- "@changesets/cli": "^2.27.10",
66
+ "@changesets/cli": "^2.27.11",
67
67
  "@testing-library/cypress": "^10.0.2",
68
68
  "@testing-library/dom": "^10.4.0",
69
69
  "@testing-library/jest-dom": "^6.6.3",
70
70
  "@testing-library/react": "^16.1.0",
71
71
  "@testing-library/user-event": "^14.5.2",
72
72
  "@types/jquery": "^3.5.32",
73
- "@types/react": "^18.3.1",
74
- "@types/react-dom": "^18.3.0",
73
+ "@types/react": "^19.0.0",
74
+ "@types/react-dom": "^19.0.0",
75
75
  "all-contributors-cli": "^6.26.1",
76
76
  "babel-jest": "^29.7.0",
77
77
  "babelify": "^10.0.0",
78
78
  "browserify": "^17.0.1",
79
79
  "budo": "^11.8.4",
80
- "cypress": "^13.16.1",
80
+ "cypress": "^13.17.0",
81
81
  "cypress-plugin-tab": "^1.0.5",
82
82
  "eslint": "^8.57.0",
83
83
  "eslint-config-prettier": "^9.1.0",
84
84
  "eslint-plugin-cypress": "^3.6.0",
85
- "eslint-plugin-jest": "^28.9.0",
86
- "eslint-plugin-react": "^7.37.2",
85
+ "eslint-plugin-jest": "^28.10.0",
86
+ "eslint-plugin-react": "^7.37.3",
87
87
  "jest": "^29.7.0",
88
88
  "jest-environment-jsdom": "^29.7.0",
89
89
  "jest-watch-typeahead": "^2.2.2",
90
90
  "onchange": "^7.1.0",
91
91
  "prettier": "^3.4.2",
92
- "react": "^18.3.1",
93
- "react-dom": "^18.3.1",
92
+ "react": "^19.0.0",
93
+ "react-dom": "^19.0.0",
94
94
  "regenerator-runtime": "^0.14.1",
95
95
  "start-server-and-test": "^2.0.9",
96
96
  "typescript": "^5.7.2"
@@ -2,6 +2,12 @@ const React = require('react');
2
2
  const { createFocusTrap } = require('focus-trap');
3
3
  const { isFocusable } = require('tabbable');
4
4
 
5
+ /**
6
+ * The major version of React currently running.
7
+ * @type {number}
8
+ */
9
+ const reactVerMajor = parseInt(/^(\d+)\./.exec(React.version)?.[1] ?? 0, 10);
10
+
5
11
  /**
6
12
  * @type {import('../index.d.ts').FocusTrap}
7
13
  */
@@ -391,10 +397,21 @@ class FocusTrap extends React.Component {
391
397
  const { containerElements } = this.props;
392
398
 
393
399
  if (child) {
394
- if (typeof child.ref === 'function') {
395
- child.ref(element);
396
- } else if (child.ref) {
397
- child.ref.current = element;
400
+ // React 19 moved the `ref` to an official prop
401
+ if (reactVerMajor >= 19) {
402
+ if (typeof child.props.ref === 'function') {
403
+ child.props.ref(element);
404
+ } else if (child.props.ref) {
405
+ child.props.ref.current = element;
406
+ }
407
+ } else {
408
+ // older versions of React had the `ref` separate from props (still works in R19
409
+ // but results in a deprecation warning in Dev builds)
410
+ if (typeof child.ref === 'function') {
411
+ child.ref(element);
412
+ } else if (child.ref) {
413
+ child.ref.current = element;
414
+ }
398
415
  }
399
416
  }
400
417