react-achievements 3.9.0 → 3.9.1
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 +37 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -18,6 +18,39 @@ npm install react-achievements
|
|
|
18
18
|
|
|
19
19
|
---
|
|
20
20
|
|
|
21
|
+
## Start Here (60 Seconds)
|
|
22
|
+
|
|
23
|
+
```tsx
|
|
24
|
+
import { AchievementProvider, useSimpleAchievements, BadgesButtonWithModal } from 'react-achievements';
|
|
25
|
+
|
|
26
|
+
const achievements = {
|
|
27
|
+
score: {
|
|
28
|
+
100: { title: 'Century!', description: 'Score 100 points', icon: '🏆' },
|
|
29
|
+
}
|
|
30
|
+
};
|
|
31
|
+
|
|
32
|
+
function AchievementsUI() {
|
|
33
|
+
const { track, unlocked } = useSimpleAchievements();
|
|
34
|
+
|
|
35
|
+
return (
|
|
36
|
+
<div>
|
|
37
|
+
<button onClick={() => track('score', 100)}>Score 100</button>
|
|
38
|
+
<BadgesButtonWithModal unlockedAchievements={unlocked} />
|
|
39
|
+
</div>
|
|
40
|
+
);
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
export default function App() {
|
|
44
|
+
return (
|
|
45
|
+
<AchievementProvider achievements={achievements} useBuiltInUI={true}>
|
|
46
|
+
<AchievementsUI />
|
|
47
|
+
</AchievementProvider>
|
|
48
|
+
);
|
|
49
|
+
}
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
---
|
|
53
|
+
|
|
21
54
|
## Usage
|
|
22
55
|
|
|
23
56
|
React Achievements supports two tracking patterns:
|
|
@@ -144,3 +177,7 @@ React Achievements is **dual-licensed**:
|
|
|
144
177
|
---
|
|
145
178
|
|
|
146
179
|
**Built with ❤️ by [Dave B](https://github.com/dave-b-b)** | [📚 Documentation](https://dave-b-b.github.io/react-achievements/) | [⭐ Star on GitHub](https://github.com/dave-b-b/react-achievements)
|
|
180
|
+
|
|
181
|
+
## AI Agents
|
|
182
|
+
|
|
183
|
+
If you're using AI coding agents, see `AGENTS.md` for a concise integration prompt, pitfalls, and the recommended API.
|