react-awesome-reveal - npm Package Compare versions

Comparing version 4.0.1 to 4.1.0

package.json

 {
   "name": "react-awesome-reveal",
   "description": "React components to add reveal animations using the Intersection Observer API and CSS Animations.",
-  "version": "4.0.1",
+  "version": "4.1.0",
   "license": "MIT",
   "source": "src/index.ts",
-  "main": "dist/main.js",
-  "module": "dist/module.js",
-  "types": "dist/types.d.ts",
+  "types": "dist/index.d.ts",
+  "main": "dist/index.js",
+  "module": "dist/index.mjs",
   "exports": {
     ".": {
-      "import": "./dist/module.js",
-      "require": "./dist/main.js"
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
     }
@@ -60,12 +61,9 @@ },
   "devDependencies": {
-    "@emotion/react": "^11.10.0",
+    "@emotion/react": "^11.10.4",
     "@emotion/serialize": "^1.1.0",
-    "@parcel/packager-ts": "^2.7.0",
-    "@parcel/transformer-typescript-tsc": "^2.7.0",
-    "@parcel/transformer-typescript-types": "^2.7.0",
-    "@types/react": "^18.0.15",
+    "@types/react": "^18.0.21",
     "@types/react-dom": "^18.0.6",
     "@types/react-is": "^17.0.3",
-    "parcel": "^2.7.0",
-    "react": "^18.2.0"
+    "react": "^18.2.0",
+    "tsup": "^6.2.3"
   },
@@ -77,5 +75,5 @@ "dependencies": {
   "scripts": {
-    "start": "parcel watch",
-    "build": "tsc --noEmit && parcel build"
+    "start": "tsup --watch",
+    "build": "tsc --noEmit && tsup"
   }
 }

README.md

@@ -10,3 +10,3 @@ # React Awesome Reveal
 
-[React Awesome Reveal](https://github.com/morellodev/react-awesome-reveal) is a library for React apps written in TypeScript that adds reveal animations using the Intersection Observer API to detect when the elements appear in the viewport. Animations are internally provided by [Emotion](https://emotion.sh) and implemented as CSS Animations to benefit from hardware acceleration.
+[React Awesome Reveal](https://react-awesome-reveal.morello.dev) is a library for React apps written in TypeScript that adds reveal animations using the Intersection Observer API to detect when the elements appear in the viewport. Animations are internally provided by [Emotion](https://emotion.sh) and implemented as CSS Animations to benefit from hardware acceleration.
 
@@ -49,3 +49,3 @@ ## Table Of Contents
 
-or, if you are using Yarn (as I strongly suggest):
+or, if you are using Yarn:
 
@@ -56,2 +56,8 @@ ```sh
 
+or, if you are using PNPM (as I strongly suggest):
+
+```sh
+pnpm add react-awesome-reveal @emotion/react
+```
+
 ## Quick Start
@@ -124,12 +130,8 @@
 
-This is _almost_ equivalent to
+Play with the `damping` prop to alter the delay by which each child will progressively appear:
 
-```jsx
-<Fade>
+```tsx
+<Fade cascade damping={0.1}>
   <p>I enter first...</p>
-</Fade>
-<Fade delay={1000}>
   <p>...then comes my turn...</p>
-</Fade>
-<Fade delay={2000}>
   <p>...and finally you see me!</p>
@@ -139,4 +141,2 @@ </Fade>
 
-with the exception that, since each `Fade` component creates an isolated visibility context, in the second snippet every `p` will be shown only if they are inside the viewport (after the specified delay).
-
 ## Custom Animations
@@ -163,8 +163,4 @@
 
-function MyAnimatedComponent({ children }) {
-  return (
-    <Reveal keyframes={customAnimation}>
-      {children}
-    </Reveal>;
-  );
+function CustomAnimation({ children }) {
+  return <Reveal keyframes={customAnimation}>{children}</Reveal>;
 }
@@ -171,0 +167,0 @@ ```

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Dev dependency count

7

decreased by-30%

Lines of code

3786

increased by6.95%

Worsened metrics

Total package byte prevSize

286243

decreased by-12.46%

Number of package files

8

decreased by-11.11%

Number of lines in readme file

219

decreased by-1.79%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes