react-achievements 2.1.1 → 2.2.0

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.
Files changed (36) hide show
  1. package/README.md +183 -338
  2. package/dist/defaultStyles.d.ts +0 -9
  3. package/dist/index.cjs.js +107 -117
  4. package/dist/index.d.ts +3 -2
  5. package/dist/index.esm.js +108 -118
  6. package/dist/providers/AchievementProvider.d.ts +1 -0
  7. package/dist/redux/achievementSlice.d.ts +1 -2
  8. package/package.json +11 -1
  9. package/rollup.config.mjs +6 -1
  10. package/src/defaultStyles.ts +0 -52
  11. package/src/hooks/useAchievement.ts +8 -11
  12. package/src/index.ts +14 -8
  13. package/src/providers/AchievementProvider.tsx +117 -136
  14. package/src/redux/achievementSlice.ts +65 -47
  15. package/src/redux/notificationSlice.ts +5 -5
  16. package/src/redux/store.ts +1 -5
  17. package/src/types.ts +12 -17
  18. package/tsconfig.json +3 -1
  19. package/demo/README.md +0 -8
  20. package/demo/eslint.config.js +0 -38
  21. package/demo/index.html +0 -13
  22. package/demo/package-lock.json +0 -12053
  23. package/demo/package.json +0 -47
  24. package/demo/public/vite.svg +0 -1
  25. package/demo/src/AchievementConfig.ts +0 -37
  26. package/demo/src/App.css +0 -42
  27. package/demo/src/App.jsx +0 -89
  28. package/demo/src/assets/achievements/explorer.webp +0 -0
  29. package/demo/src/assets/achievements/seaoned_warrior.webp +0 -0
  30. package/demo/src/assets/achievements/warrior.webp +0 -0
  31. package/demo/src/assets/react.svg +0 -1
  32. package/demo/src/index.css +0 -68
  33. package/demo/src/main.jsx +0 -10
  34. package/demo/vite.config.js +0 -7
  35. package/src/components/AchievementModal.tsx +0 -57
  36. package/src/hooks/useAchievementState.ts +0 -12
package/src/types.ts CHANGED
@@ -2,6 +2,11 @@ import {Styles} from "./defaultStyles";
2
2
 
3
3
  export type AchievementMetricValue = number | string | boolean | Date;
4
4
 
5
+ export interface AchievementState {
6
+ metrics: Record<string, AchievementMetricValue[]>;
7
+ unlockedAchievements: string[];
8
+ }
9
+
5
10
  export interface AchievementDetails {
6
11
  achievementId: string;
7
12
  achievementTitle: string;
@@ -11,8 +16,13 @@ export interface AchievementDetails {
11
16
 
12
17
  export type AchievementIconRecord = Record<string, string>;
13
18
 
19
+ export interface AchievementUnlockCondition {
20
+ isConditionMet: (value: AchievementMetricValue, state?: AchievementState) => boolean;
21
+ achievementDetails: AchievementDetails;
22
+ }
23
+
14
24
  export interface AchievementConfiguration {
15
- [metricName: string]: Array<AchievementUnlockCondition<AchievementMetricValue>>;
25
+ [metricName: string]: AchievementUnlockCondition[];
16
26
  }
17
27
 
18
28
  export type InitialAchievementMetrics = Record<string, AchievementMetricValue | AchievementMetricValue[] | undefined>;
@@ -21,24 +31,9 @@ export type AchievementMetrics = Record<string, AchievementMetricValue[]>;
21
31
  export interface AchievementProviderProps {
22
32
  children: React.ReactNode;
23
33
  config: AchievementConfiguration;
24
- initialState?: InitialAchievementMetrics & { previouslyAwardedAchievements?: string[] }; // Add optional previouslyAwardedAchievements
34
+ initialState?: InitialAchievementMetrics & { previouslyAwardedAchievements?: string[] };
25
35
  storageKey?: string;
26
36
  badgesButtonPosition?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
27
37
  styles?: Partial<Styles>;
28
38
  icons?: Record<string, string>;
29
- }
30
-
31
- export interface AchievementUnlockCondition<T extends AchievementMetricValue> {
32
- isConditionMet: (value: T) => boolean;
33
- achievementDetails: AchievementDetails;
34
- }
35
-
36
- export interface SerializedAchievementUnlockCondition {
37
- achievementDetails: AchievementDetails;
38
- conditionType: 'number' | 'string' | 'boolean' | 'date';
39
- conditionValue: any;
40
- }
41
-
42
- export interface SerializedAchievementConfiguration {
43
- [metricName: string]: SerializedAchievementUnlockCondition[];
44
39
  }
package/tsconfig.json CHANGED
@@ -107,5 +107,7 @@
107
107
  },
108
108
  "include": [
109
109
  "src",
110
- "react-confetti.d.ts"]
110
+ "stories",
111
+ "react-confetti.d.ts"
112
+ ]
111
113
  }
package/demo/README.md DELETED
@@ -1,8 +0,0 @@
1
- # React + Vite
2
-
3
- This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
4
-
5
- Currently, two official plugins are available:
6
-
7
- - [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
8
- - [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
package/demo/eslint.config.js DELETED
@@ -1,38 +0,0 @@
1
- import js from '@eslint/js'
2
- import globals from 'globals'
3
- import react from 'eslint-plugin-react'
4
- import reactHooks from 'eslint-plugin-react-hooks'
5
- import reactRefresh from 'eslint-plugin-react-refresh'
6
-
7
- export default [
8
- {
9
- files: ['**/*.{js,jsx}'],
10
- ignores: ['dist'],
11
- languageOptions: {
12
- ecmaVersion: 2020,
13
- globals: globals.browser,
14
- parserOptions: {
15
- ecmaVersion: 'latest',
16
- ecmaFeatures: { jsx: true },
17
- sourceType: 'module',
18
- },
19
- },
20
- settings: { react: { version: '18.3' } },
21
- plugins: {
22
- react,
23
- 'react-hooks': reactHooks,
24
- 'react-refresh': reactRefresh,
25
- },
26
- rules: {
27
- ...js.configs.recommended.rules,
28
- ...react.configs.recommended.rules,
29
- ...react.configs['jsx-runtime'].rules,
30
- ...reactHooks.configs.recommended.rules,
31
- 'react/jsx-no-target-blank': 'off',
32
- 'react-refresh/only-export-components': [
33
- 'warn',
34
- { allowConstantExport: true },
35
- ],
36
- },
37
- },
38
- ]
package/demo/index.html DELETED
@@ -1,13 +0,0 @@
1
- <!doctype html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8" />
5
- <link rel="icon" type="image/svg+xml" href="/vite.svg" />
6
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
- <title>Vite + React</title>
8
- </head>
9
- <body>
10
- <div id="root"></div>
11
- <script type="module" src="/src/main.jsx"></script>
12
- </body>
13
- </html>