react-scroll-to-top - npm Package Compare versions

Comparing version 2.0.3-beta.2 to 2.0.4-beta.0

dist/index.js

@@ -75,3 +75,3 @@ 'use strict';
 
-var css_248z = ".scroll-to-top {\n  background-color: white;\n  right: 40px;\n  bottom: 40px;\n  position: fixed;\n  z-index: 2;\n  cursor: pointer;\n  border-radius: 7px;\n  width: 40px;\n  height: 40px;\n  transition: opacity 1s ease-in-out;\n  box-shadow: 0 9px 25px 0 rgba(132, 128, 177, 0.28);\n  border: none;\n  outline: none;\n}\n\n.scroll-to-top:active {\n  transform: matrix(0.95, 0, 0, 0.95, 0, 0);\n}\n.scroll-to-top:focus {\n  box-shadow: 0 0 0 1px black;\n}\n";
+var css_248z = ".scroll-to-top {\n  background-color: white;\n  right: 40px;\n  bottom: 40px;\n  position: fixed;\n  z-index: 2;\n  cursor: pointer;\n  border-radius: 7px;\n  width: 40px;\n  height: 40px;\n  box-shadow: 0 9px 25px 0 rgba(132, 128, 177, 0.28);\n  border: none;\n}\n\n.scroll-to-top:active {\n  transform: matrix(0.95, 0, 0, 0.95, 0, 0);\n}\n";
 styleInject(css_248z);
@@ -92,3 +92,3 @@
 var ScrollToTop = function (_a) {
-    var _b = _a.top, top = _b === void 0 ? 20 : _b, _c = _a.className, className = _c === void 0 ? "scroll-to-top" : _c, _d = _a.color, color = _d === void 0 ? "black" : _d, _e = _a.smooth, smooth = _e === void 0 ? false : _e, _f = _a.component, component = _f === void 0 ? "" : _f, _g = _a.viewBox, viewBox = _g === void 0 ? "0 0 256 256" : _g, _h = _a.svgPath, svgPath = _h === void 0 ? "M222.138,91.475l-89.6-89.6c-2.5-2.5-6.551-2.5-9.051,0l-89.6,89.6c-2.5,2.5-2.5,6.551,0,9.051s6.744,2.5,9.244,0L122,21.85  V249.6c0,3.535,2.466,6.4,6,6.4s6-2.865,6-6.4V21.85l78.881,78.676c1.25,1.25,2.992,1.875,4.629,1.875s3.326-0.625,4.576-1.875  C224.586,98.025,224.638,93.975,222.138,91.475z" : _h, _j = _a.width, width = _j === void 0 ? "28" : _j, _k = _a.height, height = _k === void 0 ? "28" : _k, props = __rest(_a, ["top", "className", "color", "smooth", "component", "viewBox", "svgPath", "width", "height"]);
+    var _b = _a.top, top = _b === void 0 ? 20 : _b, _c = _a.className, className = _c === void 0 ? "" : _c, _d = _a.color, color = _d === void 0 ? "black" : _d, _e = _a.smooth, smooth = _e === void 0 ? false : _e, _f = _a.component, component = _f === void 0 ? "" : _f, _g = _a.viewBox, viewBox = _g === void 0 ? "0 0 256 256" : _g, _h = _a.svgPath, svgPath = _h === void 0 ? "M222.138,91.475l-89.6-89.6c-2.5-2.5-6.551-2.5-9.051,0l-89.6,89.6c-2.5,2.5-2.5,6.551,0,9.051s6.744,2.5,9.244,0L122,21.85  V249.6c0,3.535,2.466,6.4,6,6.4s6-2.865,6-6.4V21.85l78.881,78.676c1.25,1.25,2.992,1.875,4.629,1.875s3.326-0.625,4.576-1.875  C224.586,98.025,224.638,93.975,222.138,91.475z" : _h, _j = _a.width, width = _j === void 0 ? "28" : _j, _k = _a.height, height = _k === void 0 ? "28" : _k, props = __rest(_a, ["top", "className", "color", "smooth", "component", "viewBox", "svgPath", "width", "height"]);
     var _l = React.useState(false), visible = _l[0], setVisible = _l[1];
@@ -103,3 +103,3 @@ React.useEffect(function () {
     }, [top]);
-    return (React__default.createElement(React__default.Fragment, null, visible && (React__default.createElement("button", __assign({ className: className, onClick: function () { return scrollToTop(smooth); }, "aria-label": "Scroll to top" }, props), component || (React__default.createElement("svg", { width: width, height: height, fill: color, viewBox: viewBox },
+    return (React__default.createElement(React__default.Fragment, null, visible && (React__default.createElement("button", __assign({ className: "scroll-to-top " + className, onClick: function () { return scrollToTop(smooth); }, "aria-label": "Scroll to top" }, props), component || (React__default.createElement("svg", { width: width, height: height, fill: color, viewBox: viewBox },
         React__default.createElement("path", { d: svgPath })))))));
@@ -106,0 +106,0 @@ };

package.json

 {
   "name": "react-scroll-to-top",
   "author": "Herman Nygaard",
-  "version": "2.0.3-beta.2",
+  "version": "2.0.4-beta.0",
   "main": "dist/index.js",
@@ -6,0 +6,0 @@ "types": "dist/index.d.ts",

README.md

@@ -42,14 +42,14 @@ # react-scroll-to-top
 
-| Prop      | Type    | Description                                  | Default       |
-| --------- | ------- | -------------------------------------------- | ------------- |
-| smooth    | boolean | Whether to use smooth scrolling\*            | false         |
-| top       | number  | Height after page scroll to be visible       | 20            |
-| color     | string  | The SVG icon fill color                      | "black"       |
-| svgPath   | string  | The SVG icon path d attribute                | An arrow path |
-| width     | string  | The SVG icon width                           | "28"          |
-| height    | string  | The SVG icon height                          | "28"          |
-| viewBox   | string  | The SVG icon viewBox attribute               | "0 0 256 256" |
-| component | any     | Component to override SVG icon. See examples |               |
-| style     | Object  | Object to add/override styling               |               |
-| className | string  | Classname to completely override styling     |               |
+| Prop      | Type    | Description                                                                          | Default       |
+| --------- | ------- | ------------------------------------------------------------------------------------ | ------------- |
+| smooth    | boolean | Whether to use smooth scrolling\*                                                    | false         |
+| top       | number  | Height after page scroll to be visible                                               | 20            |
+| color     | string  | The SVG icon fill color                                                              | "black"       |
+| svgPath   | string  | The SVG icon path d attribute                                                        | An arrow path |
+| width     | string  | The SVG icon width                                                                   | "28"          |
+| height    | string  | The SVG icon height                                                                  | "28"          |
+| viewBox   | string  | The SVG icon viewBox attribute                                                       | "0 0 256 256" |
+| component | any     | Component to override SVG icon. See examples                                         |               |
+| style     | Object  | Object to add/override styling                                                       |               |
+| className | string  | Classname to add/override styling (note, `!important` for overrides might be needed) |               |
 
@@ -56,0 +56,0 @@ Smooth scrolling uses a newer `window.scrollTo` implementation.\

No alert changes

Improved metrics

Total package byte prevSize

16881

increased by2.3%

No dependency changes