react-awesome-reveal 5.0.0-next.10 → 5.0.0-next.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +35 -6
- package/package.json +11 -4
package/README.md
CHANGED
|
@@ -1,16 +1,45 @@
|
|
|
1
1
|
# react-awesome-reveal
|
|
2
2
|
|
|
3
|
-
Version 5
|
|
3
|
+
Reveal-on-scroll animations for React. Version 5 re-exports [`@awesome-reveal/react`](https://www.npmjs.com/package/@awesome-reveal/react), so v4 users can upgrade with no new package name.
|
|
4
|
+
|
|
5
|
+
[](https://www.npmjs.com/package/react-awesome-reveal)
|
|
6
|
+
[](https://github.com/awesome-reveal/awesome-reveal/blob/next/LICENSE)
|
|
7
|
+
|
|
8
|
+
> **Preview:** Version 5 is a prerelease. The API can change before the stable release. Tell us what works and what does not in [GitHub Discussions](https://github.com/awesome-reveal/awesome-reveal/discussions).
|
|
9
|
+
|
|
10
|
+
## Install
|
|
11
|
+
|
|
12
|
+
```sh
|
|
13
|
+
npm install react-awesome-reveal@next
|
|
14
|
+
```
|
|
15
|
+
|
|
16
|
+
For a new project, install `@awesome-reveal/react` instead. The two packages give the same API.
|
|
17
|
+
|
|
18
|
+
## Quick start
|
|
4
19
|
|
|
5
20
|
```tsx
|
|
6
21
|
import { Reveal } from "react-awesome-reveal";
|
|
7
22
|
|
|
8
|
-
|
|
23
|
+
export const Hero = () => (
|
|
24
|
+
<Reveal from="left">
|
|
25
|
+
<h1>Hello</h1>
|
|
26
|
+
</Reveal>
|
|
27
|
+
);
|
|
9
28
|
```
|
|
10
29
|
|
|
11
|
-
|
|
30
|
+
The package gives `Reveal`, `Cascade`, `useReveal`, `useCascade` and their types. Read the [`@awesome-reveal/react` README](https://www.npmjs.com/package/@awesome-reveal/react) for the full API and the steps to migrate from v4. Version 5 changes the API on purpose, so v4 code needs these steps.
|
|
31
|
+
|
|
32
|
+
## Stylesheet setup
|
|
33
|
+
|
|
34
|
+
The package loads its stylesheet automatically. Two setups need a step:
|
|
35
|
+
|
|
36
|
+
- **Astro island.** Import `react-awesome-reveal/reveal.css` in the page or in the layout that renders the island.
|
|
37
|
+
- **Next.js Pages Router with webpack.** Add `@awesome-reveal/react` to `transpilePackages` in the Next.js config. That package imports the stylesheet.
|
|
38
|
+
|
|
39
|
+
## Agent skills
|
|
40
|
+
|
|
41
|
+
The package includes the `migrating-from-v4` skill, which helps a coding agent migrate your code. pnpm can link it into your project after you approve it.
|
|
12
42
|
|
|
13
|
-
|
|
14
|
-
- In the Next.js Pages Router with webpack, add `@awesome-reveal/react` to `transpilePackages` in the Next.js config. That package imports the stylesheet.
|
|
43
|
+
## License
|
|
15
44
|
|
|
16
|
-
|
|
45
|
+
[MIT](https://github.com/awesome-reveal/awesome-reveal/blob/next/LICENSE)
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-awesome-reveal",
|
|
3
|
-
"version": "5.0.0-next.
|
|
3
|
+
"version": "5.0.0-next.11",
|
|
4
4
|
"description": "Reveal-on-scroll animations for React. This package re-exports @awesome-reveal/react.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"animate-on-scroll",
|
|
@@ -51,6 +51,13 @@
|
|
|
51
51
|
"*.css"
|
|
52
52
|
],
|
|
53
53
|
"types": "dist/index.d.ts",
|
|
54
|
+
"typesVersions": {
|
|
55
|
+
"*": {
|
|
56
|
+
"reveal.css": [
|
|
57
|
+
"dist/reveal.css.d.ts"
|
|
58
|
+
]
|
|
59
|
+
}
|
|
60
|
+
},
|
|
54
61
|
"exports": {
|
|
55
62
|
".": {
|
|
56
63
|
"types": "./dist/index.d.ts",
|
|
@@ -66,11 +73,11 @@
|
|
|
66
73
|
"access": "public"
|
|
67
74
|
},
|
|
68
75
|
"dependencies": {
|
|
69
|
-
"@awesome-reveal/react": "^1.0.0-next.
|
|
76
|
+
"@awesome-reveal/react": "^1.0.0-next.11"
|
|
70
77
|
},
|
|
71
78
|
"devDependencies": {
|
|
72
79
|
"@types/react": "^19.3.0",
|
|
73
|
-
"react": "^19.3.
|
|
80
|
+
"react": "^19.3.1"
|
|
74
81
|
},
|
|
75
82
|
"peerDependencies": {
|
|
76
83
|
"react": "^18.0.0 || ^19.0.0"
|
|
@@ -80,6 +87,6 @@
|
|
|
80
87
|
},
|
|
81
88
|
"scripts": {
|
|
82
89
|
"build": "tsc --noEmit && vite build",
|
|
83
|
-
"check:package": "tsc -p test/package && publint --strict && attw --pack . --
|
|
90
|
+
"check:package": "tsc -p test/package && publint --strict && attw --pack . --ignore-rules cjs-resolves-to-esm"
|
|
84
91
|
}
|
|
85
92
|
}
|