@react-md/progress - npm Package Compare versions

Comparing version 3.1.0 to 4.0.0

CHANGELOG.md

@@ -6,2 +6,31 @@ # Change Log
 
+# [4.0.0](https://github.com/mlaursen/react-md/compare/v3.1.1...v4.0.0) (2021-11-24)
+
+
+### Features
+
+* Update to use new JSX Transform and latest `eslint` ([8111cd3](https://github.com/mlaursen/react-md/commit/8111cd31e45bf60c1b92509264af1b71dfba5696))
+* **@react-md/typography:** Renamed Text to `Typography` ([30cf056](https://github.com/mlaursen/react-md/commit/30cf056fbaf0e3d28e04dd03f1fd37929967f7ab))
+
+
+### Other Internal Changes
+
+* always skip lib check ([229cef1](https://github.com/mlaursen/react-md/commit/229cef1e3d338ea362c1a2eaac06204c84ff21a6))
+* **react-md:** Remove prop-types package and usage ([2637a6f](https://github.com/mlaursen/react-md/commit/2637a6f43d681a06054e3a4518f692cf51baf997))
+
+
+### Breaking Changes
+
+* Minimum React version is now 16.14 instead of 16.8
+* **@react-md/typography:** The Text component has been renamed to Typography to
+help with auto-imports conflicting with the Text element that exists in
+`lib.d.ts`
+* **react-md:** There will no longer be run-time prop validation with
+the `prop-types` package.
+
+
+
+
+
+
 # [3.1.0](https://github.com/mlaursen/react-md/compare/v3.0.1...v3.1.0) (2021-09-10)
@@ -8,0 +37,0 @@

es/CircularProgress.js

@@ -23,3 +23,4 @@ var __assign = (this && this.__assign) || function () {
 };
-import React, { forwardRef, useMemo, } from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, useMemo } from "react";
 import cn from "classnames";
@@ -40,4 +41,4 @@ import { bem, getPercentage } from "@react-md/utils";
         if (maxRotation > 0) {
-            var rotate = "rotate(" + maxRotation * progress + "deg)";
-            transform = "" + rotate + (transform ? " " + transform : "");
+            var rotate = "rotate(".concat(maxRotation * progress, "deg)");
+            transform = "".concat(rotate).concat(transform ? " ".concat(transform) : "");
         }
@@ -54,40 +55,12 @@ return __assign(__assign({}, propSvgStyle), { WebkitTransform: transform, transform: transform });
     var indeterminate = !determinate;
-    return (React.createElement("span", __assign({}, props, { ref: ref, role: "progressbar", "aria-valuemin": min, "aria-valuemax": max, "aria-valuenow": value, className: cn(block({ centered: centered, small: small }), className) }),
-        React.createElement("svg", { style: svgStyle, className: cn(block("svg", {
+    return (_jsx("span", __assign({}, props, { ref: ref, role: "progressbar", "aria-valuemin": min, "aria-valuemax": max, "aria-valuenow": value, className: cn(block({ centered: centered, small: small }), className) }, { children: _jsx("svg", __assign({ style: svgStyle, className: cn(block("svg", {
                 animate: animate && determinate,
                 determinate: determinate,
                 indeterminate: indeterminate,
-            }), svgClassName), viewBox: viewBox },
-            React.createElement("circle", { style: circleStyle, className: cn(block("circle", {
+            }), svgClassName), viewBox: viewBox }, { children: _jsx("circle", { style: circleStyle, className: cn(block("circle", {
                     animate: animate && determinate,
                     determinate: determinate,
                     indeterminate: indeterminate,
-                }), circleClassName), r: radius, cx: center, cy: center }))));
+                }), circleClassName), r: radius, cx: center, cy: center }, void 0) }), void 0) }), void 0));
 });
-/* istanbul ignore next */
-if (process.env.NODE_ENV !== "production") {
-    try {
-        var PropTypes = require("prop-types");
-        CircularProgress.propTypes = {
-            id: PropTypes.string.isRequired,
-            className: PropTypes.string,
-            min: PropTypes.number,
-            max: PropTypes.number,
-            value: PropTypes.number,
-            animate: PropTypes.bool,
-            svgStyle: PropTypes.object,
-            svgClassName: PropTypes.string,
-            circleStyle: PropTypes.object,
-            circleClassName: PropTypes.string,
-            radius: PropTypes.number,
-            center: PropTypes.number,
-            centered: PropTypes.bool,
-            maxRotation: PropTypes.number,
-            dashoffset: PropTypes.number,
-            small: PropTypes.bool,
-            viewBox: PropTypes.string,
-        };
-    }
-    catch (e) { }
-}
 //# sourceMappingURL=CircularProgress.js.map

es/LinearProgress.js

@@ -23,3 +23,4 @@ var __assign = (this && this.__assign) || function () {
 };
-import React, { forwardRef, useMemo, } from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, useMemo } from "react";
 import cn from "classnames";
@@ -46,12 +47,11 @@ import { bem, getPercentage } from "@react-md/utils";
         var key = vertical ? "height" : "width";
-        return __assign(__assign({}, propBarStyle), (_a = {}, _a[key] = progress * 100 + "%", _a));
+        return __assign(__assign({}, propBarStyle), (_a = {}, _a[key] = "".concat(progress * 100, "%"), _a));
     }, [progress, propBarStyle, vertical]);
     var determinate = typeof progress === "number";
     var indeterminate = !determinate;
-    return (React.createElement("span", __assign({}, props, { ref: ref, style: style, role: "progressbar", "aria-valuemin": min, "aria-valuemax": max, "aria-valuenow": value, className: cn(block({
+    return (_jsx("span", __assign({}, props, { ref: ref, style: style, role: "progressbar", "aria-valuemin": min, "aria-valuemax": max, "aria-valuenow": value, className: cn(block({
             vertical: vertical,
             determinate: determinate,
             indeterminate: indeterminate,
-        }), className) }),
-        React.createElement("span", { style: barStyle, className: cn(block("bar", {
+        }), className) }, { children: _jsx("span", { style: barStyle, className: cn(block("bar", {
                 vertical: vertical,
@@ -69,25 +69,4 @@ "vertical-reverse": vertical && reverse,
                 "indeterminate-vertical-reverse": indeterminate && reverse && vertical,
-            }), barClassName) })));
+            }), barClassName) }, void 0) }), void 0));
 });
-/* istanbul ignore next */
-if (process.env.NODE_ENV !== "production") {
-    try {
-        var PropTypes = require("prop-types");
-        LinearProgress.propTypes = {
-            id: PropTypes.string.isRequired,
-            style: PropTypes.object,
-            className: PropTypes.string,
-            min: PropTypes.number,
-            max: PropTypes.number,
-            value: PropTypes.number,
-            animate: PropTypes.bool,
-            barStyle: PropTypes.object,
-            barClassName: PropTypes.string,
-            reverse: PropTypes.bool,
-            vertical: PropTypes.bool,
-            verticalHeight: PropTypes.number,
-        };
-    }
-    catch (e) { }
-}
 //# sourceMappingURL=LinearProgress.js.map

lib/CircularProgress.d.ts

@@ -1,2 +0,2 @@
-import React, { CSSProperties, HTMLAttributes } from "react";
+import { CSSProperties, HTMLAttributes } from "react";
 import { ProgressProps } from "./types";
@@ -67,2 +67,2 @@ export interface CircularProgressProps extends Omit<HTMLAttributes<HTMLSpanElement>, "id">, ProgressProps {
 }
-export declare const CircularProgress: React.ForwardRefExoticComponent<CircularProgressProps & React.RefAttributes<HTMLSpanElement>>;
+export declare const CircularProgress: import("react").ForwardRefExoticComponent<CircularProgressProps & import("react").RefAttributes<HTMLSpanElement>>;

lib/CircularProgress.js

@@ -13,21 +13,2 @@ "use strict";
 };
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (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 __rest = (this && this.__rest) || function (s, e) {
@@ -49,3 +30,4 @@ var t = {};
 exports.CircularProgress = void 0;
-var react_1 = __importStar(require("react"));
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
 var classnames_1 = __importDefault(require("classnames"));
@@ -66,4 +48,4 @@ var utils_1 = require("@react-md/utils");
         if (maxRotation > 0) {
-            var rotate = "rotate(" + maxRotation * progress + "deg)";
-            transform = "" + rotate + (transform ? " " + transform : "");
+            var rotate = "rotate(".concat(maxRotation * progress, "deg)");
+            transform = "".concat(rotate).concat(transform ? " ".concat(transform) : "");
         }
@@ -80,40 +62,12 @@ return __assign(__assign({}, propSvgStyle), { WebkitTransform: transform, transform: transform });
     var indeterminate = !determinate;
-    return (react_1.default.createElement("span", __assign({}, props, { ref: ref, role: "progressbar", "aria-valuemin": min, "aria-valuemax": max, "aria-valuenow": value, className: (0, classnames_1.default)(block({ centered: centered, small: small }), className) }),
-        react_1.default.createElement("svg", { style: svgStyle, className: (0, classnames_1.default)(block("svg", {
+    return ((0, jsx_runtime_1.jsx)("span", __assign({}, props, { ref: ref, role: "progressbar", "aria-valuemin": min, "aria-valuemax": max, "aria-valuenow": value, className: (0, classnames_1.default)(block({ centered: centered, small: small }), className) }, { children: (0, jsx_runtime_1.jsx)("svg", __assign({ style: svgStyle, className: (0, classnames_1.default)(block("svg", {
                 animate: animate && determinate,
                 determinate: determinate,
                 indeterminate: indeterminate,
-            }), svgClassName), viewBox: viewBox },
-            react_1.default.createElement("circle", { style: circleStyle, className: (0, classnames_1.default)(block("circle", {
+            }), svgClassName), viewBox: viewBox }, { children: (0, jsx_runtime_1.jsx)("circle", { style: circleStyle, className: (0, classnames_1.default)(block("circle", {
                     animate: animate && determinate,
                     determinate: determinate,
                     indeterminate: indeterminate,
-                }), circleClassName), r: radius, cx: center, cy: center }))));
+                }), circleClassName), r: radius, cx: center, cy: center }, void 0) }), void 0) }), void 0));
 });
-/* istanbul ignore next */
-if (process.env.NODE_ENV !== "production") {
-    try {
-        var PropTypes = require("prop-types");
-        exports.CircularProgress.propTypes = {
-            id: PropTypes.string.isRequired,
-            className: PropTypes.string,
-            min: PropTypes.number,
-            max: PropTypes.number,
-            value: PropTypes.number,
-            animate: PropTypes.bool,
-            svgStyle: PropTypes.object,
-            svgClassName: PropTypes.string,
-            circleStyle: PropTypes.object,
-            circleClassName: PropTypes.string,
-            radius: PropTypes.number,
-            center: PropTypes.number,
-            centered: PropTypes.bool,
-            maxRotation: PropTypes.number,
-            dashoffset: PropTypes.number,
-            small: PropTypes.bool,
-            viewBox: PropTypes.string,
-        };
-    }
-    catch (e) { }
-}
 //# sourceMappingURL=CircularProgress.js.map

lib/LinearProgress.d.ts

@@ -1,2 +0,2 @@
-import React, { CSSProperties, HTMLAttributes } from "react";
+import { CSSProperties, HTMLAttributes } from "react";
 import { ProgressProps } from "./types";
@@ -35,2 +35,2 @@ export interface LinearProgressProps extends Omit<HTMLAttributes<HTMLDivElement>, "id">, ProgressProps {
 }
-export declare const LinearProgress: React.ForwardRefExoticComponent<LinearProgressProps & React.RefAttributes<HTMLSpanElement>>;
+export declare const LinearProgress: import("react").ForwardRefExoticComponent<LinearProgressProps & import("react").RefAttributes<HTMLSpanElement>>;

lib/LinearProgress.js

@@ -13,21 +13,2 @@ "use strict";
 };
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (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 __rest = (this && this.__rest) || function (s, e) {
@@ -49,3 +30,4 @@ var t = {};
 exports.LinearProgress = void 0;
-var react_1 = __importStar(require("react"));
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
 var classnames_1 = __importDefault(require("classnames"));
@@ -72,12 +54,11 @@ var utils_1 = require("@react-md/utils");
         var key = vertical ? "height" : "width";
-        return __assign(__assign({}, propBarStyle), (_a = {}, _a[key] = progress * 100 + "%", _a));
+        return __assign(__assign({}, propBarStyle), (_a = {}, _a[key] = "".concat(progress * 100, "%"), _a));
     }, [progress, propBarStyle, vertical]);
     var determinate = typeof progress === "number";
     var indeterminate = !determinate;
-    return (react_1.default.createElement("span", __assign({}, props, { ref: ref, style: style, role: "progressbar", "aria-valuemin": min, "aria-valuemax": max, "aria-valuenow": value, className: (0, classnames_1.default)(block({
+    return ((0, jsx_runtime_1.jsx)("span", __assign({}, props, { ref: ref, style: style, role: "progressbar", "aria-valuemin": min, "aria-valuemax": max, "aria-valuenow": value, className: (0, classnames_1.default)(block({
             vertical: vertical,
             determinate: determinate,
             indeterminate: indeterminate,
-        }), className) }),
-        react_1.default.createElement("span", { style: barStyle, className: (0, classnames_1.default)(block("bar", {
+        }), className) }, { children: (0, jsx_runtime_1.jsx)("span", { style: barStyle, className: (0, classnames_1.default)(block("bar", {
                 vertical: vertical,
@@ -95,25 +76,4 @@ "vertical-reverse": vertical && reverse,
                 "indeterminate-vertical-reverse": indeterminate && reverse && vertical,
-            }), barClassName) })));
+            }), barClassName) }, void 0) }), void 0));
 });
-/* istanbul ignore next */
-if (process.env.NODE_ENV !== "production") {
-    try {
-        var PropTypes = require("prop-types");
-        exports.LinearProgress.propTypes = {
-            id: PropTypes.string.isRequired,
-            style: PropTypes.object,
-            className: PropTypes.string,
-            min: PropTypes.number,
-            max: PropTypes.number,
-            value: PropTypes.number,
-            animate: PropTypes.bool,
-            barStyle: PropTypes.object,
-            barClassName: PropTypes.string,
-            reverse: PropTypes.bool,
-            vertical: PropTypes.bool,
-            verticalHeight: PropTypes.number,
-        };
-    }
-    catch (e) { }
-}
 //# sourceMappingURL=LinearProgress.js.map

package.json

 {
   "name": "@react-md/progress",
-  "version": "3.1.0",
+  "version": "4.0.0",
   "description": "Create horizontal, vertical, and circular progress indicators",
@@ -31,5 +31,5 @@ "main": "./lib/index.js",
   "dependencies": {
-    "@react-md/theme": "^3.1.0",
-    "@react-md/transition": "^3.1.0",
-    "@react-md/utils": "^3.1.0",
+    "@react-md/theme": "^4.0.0",
+    "@react-md/transition": "^4.0.0",
+    "@react-md/utils": "^4.0.0",
     "classnames": "^2.3.1"
@@ -42,12 +42,9 @@ },
   "peerDependencies": {
-    "react": ">= 16.8",
-    "react-dom": ">= 16.8"
+    "react": ">= 16.14",
+    "react-dom": ">= 16.14"
   },
-  "optionalDependencies": {
-    "prop-types": ">= 15.6"
-  },
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "5891a3255f12fb34d2cc82d81d10f85f712a21e8"
+  "gitHead": "a9f2d64a777698fa65bb3196f6063cdd8321f5cb"
 }

README.md

@@ -40,5 +40,5 @@ # @react-md/progress
 ```tsx
-import React from "react";
 import { render } from "react-dom";
 import { CircularProgress, LinearProgress } from "@react-md/progress";
+import { Typography } from "@react-md/typography";
 import { useToggle } from "@react-md/utils";
@@ -75,3 +75,5 @@
         {loadingCircle && <CircularProgress id="circular-progress" />}
-        {!loadingCircle && <Text type="headline-2">Hello from circle div</Text>}
+        {!loadingCircle && (
+          <Typography type="headline-2">Hello from circle div</Typography>
+        )}
       </div>
@@ -84,3 +86,5 @@ <div
         {loadingLinear && <CircularProgress id="linear-progress" />}
-        {!loadingLinear && <Text type="headline-2">Hello from linear div</Text>}
+        {!loadingLinear && (
+          <Typography type="headline-2">Hello from linear div</Typography>
+        )}
       </div>
@@ -87,0 +91,0 @@ </>

types/CircularProgress.d.ts

@@ -1,2 +0,2 @@
-import React, { CSSProperties, HTMLAttributes } from "react";
+import { CSSProperties, HTMLAttributes } from "react";
 import { ProgressProps } from "./types";
@@ -67,2 +67,2 @@ export interface CircularProgressProps extends Omit<HTMLAttributes<HTMLSpanElement>, "id">, ProgressProps {
 }
-export declare const CircularProgress: React.ForwardRefExoticComponent<CircularProgressProps & React.RefAttributes<HTMLSpanElement>>;
+export declare const CircularProgress: import("react").ForwardRefExoticComponent<CircularProgressProps & import("react").RefAttributes<HTMLSpanElement>>;

types/LinearProgress.d.ts

@@ -1,2 +0,2 @@
-import React, { CSSProperties, HTMLAttributes } from "react";
+import { CSSProperties, HTMLAttributes } from "react";
 import { ProgressProps } from "./types";
@@ -35,2 +35,2 @@ export interface LinearProgressProps extends Omit<HTMLAttributes<HTMLDivElement>, "id">, ProgressProps {
 }
-export declare const LinearProgress: React.ForwardRefExoticComponent<LinearProgressProps & React.RefAttributes<HTMLSpanElement>>;
+export declare const LinearProgress: import("react").ForwardRefExoticComponent<LinearProgressProps & import("react").RefAttributes<HTMLSpanElement>>;

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

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

Improved metrics

Dependency count

6

decreased by-14.29%

Number of lines in readme file

94

increased by4.44%

Number of low supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

118488

decreased by-5.94%

Lines of code

1337

decreased by-12.27%

Dependency changes

• + Added@react-md/portal@4.0.3(transitive)

• + Added@react-md/theme@4.0.3(transitive)

• + Added@react-md/transition@4.0.3(transitive)

• + Added@react-md/utils@4.0.3(transitive)

• - Removed@babel/runtime@7.26.0(transitive)

• - Removed@react-md/portal@3.1.0(transitive)

• - Removed@react-md/theme@3.1.0(transitive)

• - Removed@react-md/transition@3.1.0(transitive)

• - Removed@react-md/utils@3.1.0(transitive)

• - Removed@types/prop-types@15.7.13(transitive)

• - Removed@types/react@18.3.12(transitive)

• - Removed@types/react-transition-group@4.4.11(transitive)

• - Removedcsstype@3.1.3(transitive)

• - Removeddom-helpers@5.2.1(transitive)

• - Removedobject-assign@4.1.1(transitive)

• - Removedprop-types@15.8.1(transitive)

• - Removedreact-is@16.13.1(transitive)

• - Removedreact-transition-group@4.4.5(transitive)

• - Removedregenerator-runtime@0.14.1(transitive)

• Updated@react-md/theme@^4.0.0

• Updated@react-md/transition@^4.0.0

• Updated@react-md/utils@^4.0.0