react-achievements 2.2.1 → 3.0.0

package/dist/stories/Button.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+import './button.css';
+export interface ButtonProps {
+    /**
+     * Is this the principal call to action on the page?
+     */
+    primary?: boolean;
+    /**
+     * What background color to use
+     */
+    backgroundColor?: string;
+    /**
+     * How large should the button be?
+     */
+    size?: 'small' | 'medium' | 'large';
+    /**
+     * Button contents
+     */
+    label: string;
+    /**
+     * Optional click handler
+     */
+    onClick?: () => void;
+}
+/**
+ * Primary UI component for user interaction
+ */
+export declare const Button: ({ primary, size, backgroundColor, label, ...props }: ButtonProps) => React.JSX.Element;

package/dist/stories/Button.stories.d.ts

@@ -0,0 +1,23 @@
+import type { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ primary, size, backgroundColor, label, ...props }: import("./Button").ButtonProps) => import("react").JSX.Element;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {
+        backgroundColor: {
+            control: "color";
+        };
+    };
+    args: {
+        onClick: import("@vitest/spy").Mock<[], void>;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Primary: Story;
+export declare const Secondary: Story;
+export declare const Large: Story;
+export declare const Small: Story;

package/dist/stories/Header.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import './header.css';
+type User = {
+    name: string;
+};
+export interface HeaderProps {
+    user?: User;
+    onLogin?: () => void;
+    onLogout?: () => void;
+    onCreateAccount?: () => void;
+}
+export declare const Header: ({ user, onLogin, onLogout, onCreateAccount }: HeaderProps) => React.JSX.Element;
+export {};

package/dist/stories/Header.stories.d.ts

@@ -0,0 +1,18 @@
+import type { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ user, onLogin, onLogout, onCreateAccount }: import("./Header").HeaderProps) => import("react").JSX.Element;
+    tags: string[];
+    parameters: {
+        layout: string;
+    };
+    args: {
+        onLogin: import("@vitest/spy").Mock<[], void>;
+        onLogout: import("@vitest/spy").Mock<[], void>;
+        onCreateAccount: import("@vitest/spy").Mock<[], void>;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const LoggedIn: Story;
+export declare const LoggedOut: Story;

package/dist/stories/Page.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import './page.css';
+export declare const Page: React.FC;

package/dist/stories/Page.stories.d.ts

@@ -0,0 +1,12 @@
+import type { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: import("react").FC<{}>;
+    parameters: {
+        layout: string;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const LoggedOut: Story;
+export declare const LoggedIn: Story;

package/dist/types/__mocks__/confetti-wrapper.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export declare const ConfettiWrapper: React.FC<{
+    show: boolean;
+}>;
+export default ConfettiWrapper;

package/dist/types/__mocks__/react-confetti.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const ReactConfetti: () => React.JSX.Element;
+export default ReactConfetti;

package/dist/types/__mocks__/react-toastify.d.ts

@@ -0,0 +1,13 @@
+import { ToastContent, ToastOptions } from 'react-toastify';
+declare const toast: jest.Mock<any, any, any> & {
+    success: jest.Mock<string, [content: ToastContent, options?: ToastOptions<{}> | undefined], any>;
+    error: jest.Mock<any, any, any>;
+    info: jest.Mock<any, any, any>;
+    warn: jest.Mock<any, any, any>;
+    dark: jest.Mock<any, any, any>;
+    dismiss: jest.Mock<any, any, any>;
+    __esModule: boolean;
+    default: jest.Mock<any, any, any>;
+};
+export { toast };
+export declare const ToastContainer: jest.Mock<null, [], any>;

package/dist/types/core/components/BadgesButton.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { AchievementDetails } from '../types';
+interface BadgesButtonProps {
+    onClick: () => void;
+    position: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
+    styles?: React.CSSProperties;
+    unlockedAchievements: AchievementDetails[];
+}
+export declare const BadgesButton: React.FC<BadgesButtonProps>;
+export {};

package/dist/types/core/components/BadgesModal.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { AchievementDetails, StylesProps } from '../types';
+interface BadgesModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    achievements: AchievementDetails[];
+    styles?: StylesProps['badgesModal'];
+    icons?: Record<string, string>;
+}
+export declare const BadgesModal: React.FC<BadgesModalProps>;
+export {};

package/dist/types/core/components/ConfettiWrapper.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+interface ConfettiWrapperProps {
+    show: boolean;
+}
+export declare const ConfettiWrapper: React.FC<ConfettiWrapperProps>;
+export {};

package/dist/types/core/context/AchievementContext.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import 'react-toastify/dist/ReactToastify.css';
+import { AchievementContextValue, AchievementProviderProps } from '../types';
+export declare const useAchievementContext: () => AchievementContextValue;
+export declare const AchievementProvider: React.FC<AchievementProviderProps>;

package/dist/types/core/icons/defaultIcons.d.ts

@@ -0,0 +1,81 @@
+export declare const defaultAchievementIcons: {
+    levelUp: string;
+    questComplete: string;
+    monsterDefeated: string;
+    itemCollected: string;
+    challengeCompleted: string;
+    milestoneReached: string;
+    firstStep: string;
+    newBeginnings: string;
+    breakthrough: string;
+    growth: string;
+    shared: string;
+    liked: string;
+    commented: string;
+    followed: string;
+    invited: string;
+    communityMember: string;
+    supporter: string;
+    connected: string;
+    participant: string;
+    influencer: string;
+    activeDay: string;
+    activeWeek: string;
+    activeMonth: string;
+    earlyBird: string;
+    nightOwl: string;
+    streak: string;
+    dedicated: string;
+    punctual: string;
+    consistent: string;
+    marathon: string;
+    artist: string;
+    writer: string;
+    innovator: string;
+    creator: string;
+    expert: string;
+    master: string;
+    pioneer: string;
+    performer: string;
+    thinker: string;
+    explorer: string;
+    bronze: string;
+    silver: string;
+    gold: string;
+    diamond: string;
+    legendary: string;
+    epic: string;
+    rare: string;
+    common: string;
+    special: string;
+    hidden: string;
+    one: string;
+    ten: string;
+    hundred: string;
+    thousand: string;
+    clicked: string;
+    used: string;
+    found: string;
+    built: string;
+    solved: string;
+    discovered: string;
+    unlocked: string;
+    upgraded: string;
+    repaired: string;
+    defended: string;
+    default: string;
+    loading: string;
+    error: string;
+    success: string;
+    failure: string;
+    trophy: string;
+    star: string;
+    flag: string;
+    puzzle: string;
+    gem: string;
+    crown: string;
+    medal: string;
+    ribbon: string;
+    badge: string;
+    shield: string;
+};

package/dist/types/core/storage/LocalStorage.d.ts

@@ -0,0 +1,16 @@
+import { AchievementStorage, AchievementMetrics } from '../types';
+export declare class LocalStorage implements AchievementStorage {
+    private storageKey;
+    constructor(storageKey: string);
+    private serializeValue;
+    private deserializeValue;
+    private serializeMetrics;
+    private deserializeMetrics;
+    private getStorageData;
+    private setStorageData;
+    getMetrics(): AchievementMetrics;
+    setMetrics(metrics: AchievementMetrics): void;
+    getUnlockedAchievements(): string[];
+    setUnlockedAchievements(achievements: string[]): void;
+    clear(): void;
+}

package/dist/types/core/storage/MemoryStorage.d.ts

@@ -0,0 +1,11 @@
+import { AchievementStorage, AchievementMetrics } from '../types';
+export declare class MemoryStorage implements AchievementStorage {
+    private metrics;
+    private unlockedAchievements;
+    constructor();
+    getMetrics(): AchievementMetrics;
+    setMetrics(metrics: AchievementMetrics): void;
+    getUnlockedAchievements(): string[];
+    setUnlockedAchievements(achievements: string[]): void;
+    clear(): void;
+}

package/dist/types/core/styles/defaultStyles.d.ts

@@ -0,0 +1,2 @@
+import { StylesProps } from '../types';
+export declare const defaultStyles: Required<StylesProps>;

package/dist/types/core/types.d.ts

@@ -0,0 +1,74 @@
+export type AchievementMetricValue = number | string | boolean | Date | null | undefined;
+export type AchievementMetricArrayValue = AchievementMetricValue | AchievementMetricValue[];
+export declare const isDate: (value: any) => value is Date;
+export interface AchievementMetrics {
+    [key: string]: AchievementMetricValue[];
+}
+export interface AchievementDetails {
+    achievementId: string;
+    achievementTitle: string;
+    achievementDescription: string;
+    achievementIconKey?: string;
+}
+export interface AchievementCondition {
+    isConditionMet: (value: AchievementMetricArrayValue, state: AchievementState) => boolean;
+    achievementDetails: {
+        achievementId: string;
+        achievementTitle: string;
+        achievementDescription: string;
+        achievementIconKey: string;
+    };
+}
+export interface AchievementConfiguration {
+    [key: string]: AchievementCondition[];
+}
+export interface InitialAchievementMetrics {
+    [key: string]: AchievementMetricValue;
+}
+export interface AchievementState {
+    metrics: AchievementMetrics;
+    unlockedAchievements: string[];
+}
+export interface AchievementStorage {
+    getMetrics(): AchievementMetrics;
+    setMetrics(metrics: AchievementMetrics): void;
+    getUnlockedAchievements(): string[];
+    setUnlockedAchievements(achievements: string[]): void;
+    clear(): void;
+}
+export interface AchievementContextValue {
+    updateMetrics: (metrics: AchievementMetrics | ((prev: AchievementMetrics) => AchievementMetrics)) => void;
+    unlockedAchievements: string[];
+    resetStorage: () => void;
+}
+export interface StylesProps {
+    badgesButton?: React.CSSProperties;
+    badgesModal?: {
+        overlay?: React.CSSProperties;
+        content?: React.CSSProperties;
+        header?: React.CSSProperties;
+        closeButton?: React.CSSProperties;
+        achievementList?: React.CSSProperties;
+        achievementItem?: React.CSSProperties;
+        achievementTitle?: React.CSSProperties;
+        achievementDescription?: React.CSSProperties;
+        achievementIcon?: React.CSSProperties;
+    };
+}
+export interface AchievementProviderProps {
+    children: React.ReactNode;
+    config: AchievementConfiguration;
+    initialState?: InitialAchievementMetrics & {
+        previouslyAwardedAchievements?: string[];
+    };
+    storageKey?: string;
+    badgesButtonPosition?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
+    styles?: Partial<StylesProps>;
+    icons?: Record<string, string>;
+    storage?: AchievementStorage;
+    onAchievementUnlocked?: (achievement: AchievementDetails) => void;
+}
+export declare enum StorageType {
+    Local = "local",
+    Memory = "memory"
+}

package/dist/types/hooks/useAchievements.d.ts

@@ -0,0 +1 @@
+export declare const useAchievements: () => import("../providers/AchievementProvider").AchievementContextType;

package/dist/types/index.d.ts

@@ -0,0 +1,10 @@
+export type { AchievementMetrics, AchievementConfiguration, AchievementDetails, AchievementCondition, AchievementMetricValue, AchievementMetricArrayValue, InitialAchievementMetrics, AchievementState, AchievementStorage, AchievementContextValue, StylesProps, AchievementProviderProps, } from './core/types';
+export { LocalStorage } from './core/storage/LocalStorage';
+export { StorageType } from './core/types';
+export { BadgesButton } from './core/components/BadgesButton';
+export { BadgesModal } from './core/components/BadgesModal';
+export { ConfettiWrapper } from './core/components/ConfettiWrapper';
+export { AchievementProvider, AchievementContext } from './providers/AchievementProvider';
+export { useAchievements } from './hooks/useAchievements';
+export { defaultStyles } from './core/styles/defaultStyles';
+export { defaultAchievementIcons } from './core/icons/defaultIcons';

package/dist/types/providers/AchievementProvider.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+import { AchievementConfiguration, AchievementStorage, AchievementMetrics, StorageType } from '../core/types';
+import 'react-toastify/dist/ReactToastify.css';
+export interface AchievementContextType {
+    update: (metrics: Record<string, any>) => void;
+    achievements: {
+        unlocked: string[];
+        all: Record<string, any>;
+    };
+    reset: () => void;
+    getState: () => {
+        metrics: AchievementMetrics;
+        unlocked: string[];
+    };
+}
+export declare const AchievementContext: React.Context<AchievementContextType | undefined>;
+interface AchievementProviderProps {
+    achievements: AchievementConfiguration;
+    storage?: AchievementStorage | StorageType;
+    children: React.ReactNode;
+    icons?: Record<string, string>;
+}
+export declare const AchievementProvider: React.FC<AchievementProviderProps>;
+export {};

package/dist/types/setupTests.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/types/stories/Button.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import './button.css';
+export interface ButtonProps {
+    /** Is this the principal call to action on the page? */
+    primary?: boolean;
+    /** What background color to use */
+    backgroundColor?: string;
+    /** How large should the button be? */
+    size?: 'small' | 'medium' | 'large';
+    /** Button contents */
+    label: string;
+    /** Optional click handler */
+    onClick?: () => void;
+}
+/** Primary UI component for user interaction */
+export declare const Button: ({ primary, size, backgroundColor, label, ...props }: ButtonProps) => React.JSX.Element;

package/dist/types/stories/Button.stories.d.ts

@@ -0,0 +1,23 @@
+import type { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ primary, size, backgroundColor, label, ...props }: import("./Button").ButtonProps) => import("react").JSX.Element;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {
+        backgroundColor: {
+            control: "color";
+        };
+    };
+    args: {
+        onClick: import("@vitest/spy").Mock<(...args: any[]) => any>;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Primary: Story;
+export declare const Secondary: Story;
+export declare const Large: Story;
+export declare const Small: Story;

package/dist/types/stories/Header.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import './header.css';
+type User = {
+    name: string;
+};
+export interface HeaderProps {
+    user?: User;
+    onLogin?: () => void;
+    onLogout?: () => void;
+    onCreateAccount?: () => void;
+}
+export declare const Header: ({ user, onLogin, onLogout, onCreateAccount }: HeaderProps) => React.JSX.Element;
+export {};

package/dist/types/stories/Header.stories.d.ts

@@ -0,0 +1,18 @@
+import type { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: ({ user, onLogin, onLogout, onCreateAccount }: import("./Header").HeaderProps) => import("react").JSX.Element;
+    tags: string[];
+    parameters: {
+        layout: string;
+    };
+    args: {
+        onLogin: import("@vitest/spy").Mock<(...args: any[]) => any>;
+        onLogout: import("@vitest/spy").Mock<(...args: any[]) => any>;
+        onCreateAccount: import("@vitest/spy").Mock<(...args: any[]) => any>;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const LoggedIn: Story;
+export declare const LoggedOut: Story;

package/dist/types/stories/Page.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import './page.css';
+export declare const Page: React.FC;

package/dist/types/stories/Page.stories.d.ts

@@ -0,0 +1,12 @@
+import type { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+    component: import("react").FC<{}>;
+    parameters: {
+        layout: string;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const LoggedOut: Story;
+export declare const LoggedIn: Story;

package/package.json

@@ -1,66 +1,84 @@
 {
   "name": "react-achievements",
-  "version": "2.2.1",
-  "description": "This package allows users to transpose a React achievements engine over their React apps",
-  "keywords": [
-    "react",
-    "badge",
-    "achievement"
-  ],
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/dave-b-b/react-achievements.git"
-  },
-  "main": "dist/cjs.js",
-  "module": "dist/index.esm.js",
+  "version": "3.0.0",
+  "description": "Core achievement system for React applications",
+  "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
     "build": "rollup -c",
-    "deploy": "npm run build && npm publish",
+    "test": "jest",
+    "prepare": "npm run build",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build"
   },
-  "author": "David Brown",
-  "license": "ISC",
+  "peerDependencies": {
+    "react": ">=16.8.0",
+    "react-confetti": "^6.1.0",
+    "react-dom": ">=16.8.0",
+    "react-modal": "^3.16.1",
+    "react-toastify": "^9.1.3",
+    "react-use": "^17.4.0"
+  },
   "devDependencies": {
-    "@chromatic-com/storybook": "^1.6.1",
-    "@emotion/react": "^11.14.0",
-    "@emotion/styled": "^11.14.0",
-    "@mui/icons-material": "^6.4.8",
-    "@rollup/plugin-commonjs": "^26.0.1",
-    "@rollup/plugin-node-resolve": "^15.2.3",
-    "@rollup/plugin-replace": "^6.0.2",
-    "@storybook/addon-essentials": "^8.6.8",
-    "@storybook/addon-interactions": "^8.6.8",
-    "@storybook/addon-links": "^8.6.8",
-    "@storybook/addon-onboarding": "^8.6.8",
-    "@storybook/addon-webpack5-compiler-swc": "^1.0.5",
-    "@storybook/blocks": "^8.6.8",
-    "@storybook/react": "^8.6.8",
-    "@storybook/react-webpack5": "^8.6.8",
-    "@storybook/test": "^8.6.8",
-    "@types/jest": "^29.5.12",
-    "@types/node": "^20.14.12",
-    "@types/react": "^18.3.3",
-    "@types/react-dom": "^18.3.0",
-    "postcss": "^8.5.3",
-    "rollup": "^4.19.0",
-    "rollup-plugin-postcss": "^4.0.2",
-    "rollup-plugin-typescript2": "^0.36.0",
-    "storybook": "^8.6.8",
-    "typescript": "^5.5.4"
+    "@babel/core": "^7.22.5",
+    "@babel/preset-env": "^7.22.5",
+    "@babel/preset-react": "^7.22.5",
+    "@babel/preset-typescript": "^7.22.5",
+    "@reduxjs/toolkit": "^2.7.0",
+    "@rollup/plugin-commonjs": "^25.0.2",
+    "@rollup/plugin-node-resolve": "^15.1.0",
+    "@rollup/plugin-typescript": "^11.1.1",
+    "@storybook/addon-essentials": "^8.6.12",
+    "@storybook/addon-interactions": "^8.6.12",
+    "@storybook/addon-onboarding": "^8.6.12",
+    "@storybook/addon-webpack5-compiler-swc": "^3.0.0",
+    "@storybook/blocks": "^8.6.12",
+    "@storybook/react": "^8.6.12",
+    "@storybook/react-webpack5": "^8.6.12",
+    "@storybook/test": "^8.6.12",
+    "@testing-library/jest-dom": "^5.16.5",
+    "@testing-library/react": "^14.0.0",
+    "@testing-library/user-event": "^14.4.3",
+    "@types/jest": "^29.5.2",
+    "@types/react": "^18.2.12",
+    "@types/react-dom": "^18.2.5",
+    "@types/react-modal": "^3.16.0",
+    "identity-obj-proxy": "^3.0.0",
+    "jest": "^29.5.0",
+    "jest-environment-jsdom": "^29.5.0",
+    "prop-types": "^15.8.1",
+    "react": "^18.2.0",
+    "react-confetti": "^6.1.0",
+    "react-dom": "^18.2.0",
+    "react-modal": "^3.16.1",
+    "react-redux": "^9.2.0",
+    "react-toastify": "^9.1.3",
+    "react-use": "^17.4.0",
+    "rollup": "^3.25.1",
+    "rollup-plugin-dts": "^5.3.0",
+    "rollup-plugin-peer-deps-external": "^2.2.4",
+    "storybook": "^8.6.12",
+    "ts-jest": "^29.3.2",
+    "typescript": "^5.1.3",
+    "zustand": "^5.0.4"
   },
-  "peerDependencies": {
-    "@reduxjs/toolkit": "^1.0.0",
-    "react": "^18.0.0",
-    "react-confetti": "^6.0.0",
-    "react-dom": "^18.0.0",
-    "react-redux": "^8.0.0 || ^9.0.0",
-    "react-toastify": "^10.0.0",
-    "react-use": "^17.0.0"
+  "files": [
+    "dist"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/dave-b-b/react-achievements.git"
+  },
+  "keywords": [
+    "react",
+    "achievements",
+    "gamification",
+    "core"
+  ],
+  "author": "Dave B",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/dave-b-b/react-achievements/issues"
   },
-  "dependencies": {
-    "react-toastify": "^10.0.0"
-  }
+  "homepage": "https://github.com/dave-b-b/react-achievements#readme"
 }

package/.idea/jsLibraryMappings.xml

@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="JavaScriptLibraryMappings">
-    <includedPredefinedLibrary name="Node.js Core" />
-  </component>
-</project>