@react-md/divider - npm Package Compare versions

Comparing version 2.0.0-alpha.0 to 2.0.0-alpha.1

es/Divider.js

@@ -23,8 +23,7 @@ var __assign = (this && this.__assign) || function () {
 import cn from "classnames";
+import { bem } from "@react-md/theme";
+var block = bem("rmd-divider");
 var Divider = function (providedProps) {
     var _a = providedProps, inset = _a.inset, vertical = _a.vertical, forwardedRef = _a.forwardedRef, className = _a.className, props = __rest(_a, ["inset", "vertical", "forwardedRef", "className"]);
-    return createElement(vertical ? "div" : "hr", __assign({}, props, { ref: forwardedRef, className: cn("rmd-divider", {
-            "rmd-divider--inset": inset,
-            "rmd-divider--vertical": vertical,
-        }, className) }));
+    return createElement(vertical ? "div" : "hr", __assign({}, props, { ref: forwardedRef, className: cn(block({ inset: inset, vertical: vertical }), className) }));
 };
@@ -31,0 +30,0 @@ var defaultProps = {

es/index.js

 export { default as Divider } from "./Divider";
 export * from "./Divider";
-export { default as VerticalDivider } from "./VerticalDivider";
-export * from "./VerticalDivider";
+export { default as VerticalDivider, } from "./VerticalDivider";
 //# sourceMappingURL=index.js.map

es/VerticalDivider.js

@@ -21,3 +21,3 @@ var __assign = (this && this.__assign) || function () {
 };
-import React, { useRef, useState, useEffect, } from "react";
+import React, { useCallback, useState, } from "react";
 import Divider from "./Divider";
@@ -36,15 +36,15 @@ /**
     }
-    var ref = useRef(null);
     var _a = useState(undefined), height = _a[0], setHeight = _a[1];
-    useEffect(function () {
-        if (ref.current && ref.current.parentElement) {
-            var h = ref.current.parentElement.offsetHeight;
-            if (maxHeight <= 1) {
-                setHeight(h * maxHeight);
-            }
-            else {
-                setHeight(Math.min(h, maxHeight));
-            }
+    var ref = useCallback(function (instance) {
+        if (!instance || !instance.parentElement) {
+            return;
         }
-    }, [ref]);
+        var height = instance.parentElement.offsetHeight;
+        if (maxHeight <= 1) {
+            setHeight(height * maxHeight);
+        }
+        else {
+            setHeight(Math.min(height, maxHeight));
+        }
+    }, [maxHeight]);
     return { ref: ref, height: height };
@@ -51,0 +51,0 @@ }

lib/Divider.js

@@ -35,8 +35,7 @@ "use strict";
 var classnames_1 = __importDefault(require("classnames"));
+var theme_1 = require("@react-md/theme");
+var block = theme_1.bem("rmd-divider");
 var Divider = function (providedProps) {
     var _a = providedProps, inset = _a.inset, vertical = _a.vertical, forwardedRef = _a.forwardedRef, className = _a.className, props = __rest(_a, ["inset", "vertical", "forwardedRef", "className"]);
-    return react_1.createElement(vertical ? "div" : "hr", __assign({}, props, { ref: forwardedRef, className: classnames_1.default("rmd-divider", {
-            "rmd-divider--inset": inset,
-            "rmd-divider--vertical": vertical,
-        }, className) }));
+    return react_1.createElement(vertical ? "div" : "hr", __assign({}, props, { ref: forwardedRef, className: classnames_1.default(block({ inset: inset, vertical: vertical }), className) }));
 };
@@ -43,0 +42,0 @@ var defaultProps = {

lib/index.js

@@ -11,3 +11,2 @@ "use strict";
 exports.VerticalDivider = VerticalDivider_1.default;
-__export(require("./VerticalDivider"));
 //# sourceMappingURL=index.js.map

lib/VerticalDivider.js

@@ -47,15 +47,15 @@ "use strict";
     }
-    var ref = react_1.useRef(null);
     var _a = react_1.useState(undefined), height = _a[0], setHeight = _a[1];
-    react_1.useEffect(function () {
-        if (ref.current && ref.current.parentElement) {
-            var h = ref.current.parentElement.offsetHeight;
-            if (maxHeight <= 1) {
-                setHeight(h * maxHeight);
-            }
-            else {
-                setHeight(Math.min(h, maxHeight));
-            }
+    var ref = react_1.useCallback(function (instance) {
+        if (!instance || !instance.parentElement) {
+            return;
         }
-    }, [ref]);
+        var height = instance.parentElement.offsetHeight;
+        if (maxHeight <= 1) {
+            setHeight(height * maxHeight);
+        }
+        else {
+            setHeight(Math.min(height, maxHeight));
+        }
+    }, [maxHeight]);
     return { ref: ref, height: height };
@@ -62,0 +62,0 @@ }

package.json

 {
   "name": "@react-md/divider",
-  "version": "2.0.0-alpha.0",
+  "version": "2.0.0-alpha.1",
   "description": "This package is used to create horizontal or vertical dividers in your application.",
@@ -32,4 +32,4 @@ "scripts": {
   "dependencies": {
-    "@react-md/theme": "^2.0.0-alpha.0",
-    "@react-md/utils": "^2.0.0-alpha.0",
+    "@react-md/theme": "^2.0.0-alpha.1",
+    "@react-md/utils": "^2.0.0-alpha.1",
     "classnames": "^2.2.6"
@@ -46,3 +46,3 @@ },
   },
-  "gitHead": "cc5de21740e62c1fd5da8f832f562c48eb028717"
+  "gitHead": "9197bcdf38df3cff304499431696dc8e950b4b17"
 }

src/index.ts

 export { default as Divider } from "./Divider";
 export * from "./Divider";
 
-export { default as VerticalDivider } from "./VerticalDivider";
-export * from "./VerticalDivider";
+export {
+  default as VerticalDivider,
+  VerticalDividerProps,
+} from "./VerticalDivider";

types/index.d.ts

 export { default as Divider } from "./Divider";
 export * from "./Divider";
-export { default as VerticalDivider } from "./VerticalDivider";
-export * from "./VerticalDivider";
+export { default as VerticalDivider, VerticalDividerProps, } from "./VerticalDivider";

types/VerticalDivider.d.ts

@@ -1,2 +0,2 @@
-import React, { FunctionComponent, HTMLAttributes } from "react";
+import { FunctionComponent, HTMLAttributes } from "react";
 export interface VerticalDividerProps extends HTMLAttributes<HTMLDivElement> {
@@ -22,3 +22,3 @@ /**
 export declare function useVerticalDividerHeight(maxHeight: number): {
-    ref: React.RefObject<HTMLDivElement>;
+    ref: (instance: HTMLDivElement | null) => void;
     height: number | undefined;
@@ -25,0 +25,0 @@ };

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Mixed license

License

(Experimental) Package contains multiple licenses.

Found 1 instance in 1 package

Improved metrics

Number of low license alerts

0

decreased by-100%

Number of low quality alerts

2

decreased by-33.33%

Worsened metrics

Total package byte prevSize

58701

decreased by-10.73%

Number of package files

39

decreased by-2.5%

Lines of code

774

decreased by-7.97%

Dependency changes

• Updated@react-md/theme@^2.0.0-alpha.1

• Updated@react-md/utils@^2.0.0-alpha.1