react-detectable-overflow - npm Package Compare versions

Comparing version 0.7.1 to 0.7.2

dist/DetectableOverflow.js

@@ -17,6 +17,32 @@ "use strict";
 })();
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DetectableOverflow = void 0;
-var React = require("react");
-var react_resize_detector_1 = require("react-resize-detector");
+var React = __importStar(require("react"));
+var react_resize_detector_1 = __importDefault(require("react-resize-detector"));
 var defaultTag = 'div';
@@ -23,0 +49,0 @@ var defaultStyle = {

dist/useOverflowDetector.d.ts

@@ -5,5 +5,5 @@ /// <reference types="react" />
 }
-export declare function useOverflowDetector(props: useOverflowDetectorProps): {
+export declare function useOverflowDetector(props?: useOverflowDetectorProps): {
     overflow: boolean;
-    ref: import("react").MutableRefObject<HTMLElement | undefined>;
+    ref: import("react").RefObject<HTMLElement>;
 };

dist/useOverflowDetector.js

@@ -7,4 +7,5 @@ "use strict";
 function useOverflowDetector(props) {
+    if (props === void 0) { props = {}; }
     var _a = (0, react_1.useState)(false), overflow = _a[0], setOverflow = _a[1];
-    var ref = (0, react_1.useRef)();
+    var ref = (0, react_1.useRef)(null);
     var updateState = (0, react_1.useCallback)(function () {
@@ -11,0 +12,0 @@ if (ref.current == undefined) {

package.json

 {
   "name": "react-detectable-overflow",
-  "version": "0.7.1",
+  "version": "0.7.2",
   "description": "React hook/component to detect overflow state",
@@ -20,5 +20,2 @@ "author": {
   },
-  "engines": {
-    "node": ">=18"
-  },
   "main": "dist/index.js",
@@ -43,3 +40,3 @@ "types": "dist/index.d.ts",
   "dependencies": {
-    "react-resize-detector": "^8.0.3"
+    "react-resize-detector": "^8.0.4"
   },
@@ -46,0 +43,0 @@ "peerDependencies": {

README.md

@@ -30,3 +30,3 @@ # React Detectable Overflow
 const SampleComponent = () => {
-  const { ref, overflow } = useOverflowDetector();
+  const { ref, overflow } = useOverflowDetector({});
 
@@ -86,3 +86,3 @@ return (
 const SampleComponent = () => {
-  const { ref, overflow } = useOverflowDetector();
+  const { ref, overflow } = useOverflowDetector({});
 
@@ -89,0 +89,0 @@ return <div ref={ref}>{overflow ? 'short' : 'loooooooooooooooooooooooooooooooooooooong'}</div>;

src/useOverflowDetector.ts

@@ -8,5 +8,5 @@ import { useCallback, useState, useRef, useEffect } from 'react';
 
-export function useOverflowDetector(props: useOverflowDetectorProps) {
-  const [overflow, setOverflow] = useState<boolean>(false);
-  const ref = useRef<HTMLElement>();
+export function useOverflowDetector(props: useOverflowDetectorProps = {}) {
+  const [overflow, setOverflow] = useState(false);
+  const ref = useRef<HTMLElement>(null);
 
@@ -29,3 +29,3 @@ const updateState = useCallback(() => {
   useResizeDetector({
-    targetRef: ref as React.MutableRefObject<HTMLElement>,
+    targetRef: ref,
     onResize: updateState,
@@ -32,0 +32,0 @@ });

tsconfig.json

@@ -9,3 +9,4 @@ {
     "jsx": "react",
-    "sourceMap": true
+    "sourceMap": true,
+    "esModuleInterop": true
   },
@@ -12,0 +13,0 @@ "include": [

No alert changes

Improved metrics

Total package byte prevSize

18838

7.03%

Lines of code

298

10.37%

Dependency changes

• Updated

  react-resize-detector@^8.0.4