Upgrade react and refactor

Author: vlazh

package.json

@@ -13,42 +13,40 @@
   "scripts": {
     "clean": "rimraf dist/*",
     "copy:configs": "copyfiles package.json .npmignore README.md LICENSE ./dist/",
-    "build": "npm run clean && tsc --project ./tsconfig.json",
-    "build-to-tutoron": "tsc --project ./tsconfig.json --outDir '/home/vladimir/dev/sources/tutoron/node_modules/react-outside-click-listener'",
-    "build-to-player": "tsc --project ./tsconfig.json --outDir '/home/vladimir/dev/sources/player/node_modules/react-outside-click-listener'",
+    "build": "npm run clean && tsc --build ./tsconfig.json",
     "patch-publish": "npm run build && npm version patch && npm run copy:configs && npm publish ./dist/ && git push origin master --follow-tags",
     "minor-publish": "npm run build && npm version minor && npm run copy:configs && npm publish ./dist/ && git push origin master --follow-tags"
   },
   "devDependencies": {
-    "@eslint/compat": "^1.2.1",
-    "@eslint/eslintrc": "^3.1.0",
-    "@eslint/js": "^9.13.0",
-    "@js-toolkit/configs": "^3.93.9",
+    "@eslint/compat": "^1.2.4",
+    "@eslint/eslintrc": "^3.2.0",
+    "@eslint/js": "^9.16.0",
+    "@js-toolkit/configs": "^3.93.13",
     "@types/eslint": "^9.6.1",
     "@types/eslint__eslintrc": "^2.1.2",
     "@types/eslint__js": "^8.42.3",
-    "@types/react": "^18.3.11",
-    "@typescript-eslint/eslint-plugin": "^8.11.0",
-    "@typescript-eslint/parser": "^8.11.0",
+    "@types/react": "^19.0.1",
+    "@typescript-eslint/eslint-plugin": "^8.18.0",
+    "@typescript-eslint/parser": "^8.18.0",
     "copyfiles": "^2.4.1",
-    "eslint": "^9.13.0",
+    "eslint": "^9.16.0",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-config-prettier": "^9.1.0",
     "eslint-config-standard": "^17.1.0",
-    "eslint-import-resolver-typescript": "^3.6.3",
+    "eslint-import-resolver-typescript": "^3.7.0",
     "eslint-plugin-import": "^2.31.0",
-    "eslint-plugin-jsx-a11y": "^6.10.0",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
     "eslint-plugin-prettier": "^5.2.1",
-    "eslint-plugin-promise": "^7.1.0",
-    "eslint-plugin-react": "^7.37.1",
-    "eslint-plugin-react-hooks": "5.1.0-rc-fb9a90fa48-20240614",
-    "prettier": "^3.3.3",
-    "react": "^18.3.1",
+    "eslint-plugin-promise": "^7.2.1",
+    "eslint-plugin-react": "^7.37.2",
+    "eslint-plugin-react-hooks": "5.1.0",
+    "prettier": "^3.4.2",
+    "react": "^19.0.0",
     "rimraf": "^6.0.1",
-    "typescript": "^5.6.3",
-    "typescript-eslint": "^8.10.0"
+    "typescript": "^5.7.2",
+    "typescript-eslint": "^8.18.0"
   },
   "peerDependencies": {
-    "react": ">= 17.0"
+    "react": ">= 19"
   }
 }

src/OutsideClickListener/OutsideClickListener.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 
 /** Map of elements and selectors */
-export type HtmlTagSelectorMap = { [P in keyof JSX.IntrinsicElements]?: string | undefined };
+export type HtmlTagSelectorMap = { [P in keyof React.JSX.IntrinsicElements]?: string | undefined };
 
 export interface OutsideClickListenerProps {
   /**
@@ -11,7 +11,7 @@ export interface OutsideClickListenerProps {
   onOutsideClick: (nativeEvent: Event) => void;
   events?: (keyof GlobalEventHandlersEventMap)[];
   stopPropagation?: boolean;
-  children: React.ReactElement & { ref?: React.Ref<Node> };
+  children: React.ReactElement<React.RefAttributes<Node>>;
   /**
    * `id` or `Ref` or `Node`.
    * The most top parent node of child node to detect outside click.
@@ -89,17 +89,17 @@ export default function OutsideClickListener({
   ignoreTopNode,
   windowBlurAsOutsideClick,
   children,
-}: OutsideClickListenerProps): JSX.Element {
+}: OutsideClickListenerProps): React.JSX.Element {
   const selfNodeRef = React.useRef<Element>(null);
   const ignoreRef = React.useRef(ignore);
   ignoreRef.current = ignore;
 
   const refHandler = React.useCallback(
     (node: Element | null) => {
-      if (children.ref) setRef(children.ref, node); // pass ref to child ref handler if exists
+      if (children.props.ref) setRef(children.props.ref, node); // pass ref to child ref handler if exists
       setRef(selfNodeRef, node);
     },
-    [children.ref]
+    [children.props.ref]
   );
 
   const outsideClickHandler = React.useCallback<OutsideClickListenerProps['onOutsideClick']>(
@@ -157,5 +157,5 @@ export default function OutsideClickListener({
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [outsideClickHandler, disabled, topNode]);
 
-  return <>{React.cloneElement(children, { ref: refHandler })}</>;
+  return React.cloneElement(children, { ref: refHandler });
 }