@enigma-lake/dice-play-controller-sdk 1.3.8 → 2.0.0

package/README.md

@@ -1,180 +1,180 @@
-# DicePlayController
-
-The `DicePlayController` component is a key part of the gameplay interface, allowing users to initiate a play or cash out based on their current game state. It supports manual play, dynamic currency handling, and play amount adjustments.
-
----
-
-## Component Overview
-
-The `DicePlayController` allows the user to:
-
-- Select a currency.
-- Adjust the play amount.
-- Start a play
-
----
-
-## Setup
-
-### 1. Install the package using npm:
-
-```bash
-npm install @enigma-lake/dice-play-controller-sdk
-```
-
-### 2. Import the component and styles in your project:
-
-```tsx
-import {
-  AUTO_PLAY_STATE,
-  GAME_MODE,
-  ManualPlayProvider,
-} from "@enigma-lake/dice-play-controller-sdk";
-
-import "@enigma-lake/dice-play-controller-sdk/dist/style.css";
-```
-
----
-
-## Context & Provider
-
-### `ManualPlayProvider`
-
-The `ManualPlayProvider` wraps the DicePlayController, managing both manual play and autoplay. It uses React Context to provide game state and actions throughout the component tree.
-
-🔹 **Features of `ManualPlayProvider`**:
-
-- **Provides Context:** Exposes state and functions for controlling play behavior.
-
-## Props
-
-### 1. `StylingProps`
-
-Handles the styling-related properties for the component.
-
-- **`panel` (optional)**: Custom styling for the play controller.
-
-  - **`bgColorHex`**: Hex color for the panel background.
-  - **`bgColorOpacity` (optional)**: Opacity for the panel background.
-  - **`bottom`**: Position of the panel relative to the window.
-
-- **`dropdown` (optional)**: Custom styling for the dropdown.
-  - **`bgColorHex`**: Hex color for the panel background.
-
-### 2. `CurrencyProps`
-
-Handles currency-related logic and settings.
-
-- **`currencyOptions`**: An object containing the following properties:
-  - **`current`**: The currently selected currency
-  - **`available`**: Array of available currencies that the user can choose from.
-
-### 3. `ActionsProps`
-
-Defines functions for the user actions.
-
-- **`onPlay`**: A callback function to trigger when the user starts a play.
-
-### 4. `PlaySettingsProps`
-
-Handles game-specific settings and states.
-
-- **`playOptions`**: An object containing the following properties:
-
-  - **`disabledController`**: Boolean flag to disable all interactive elements in the component, preventing user interactions (e.g., when the game is in progress).
-  - **`displayController`**: Boolean flag to determine if the play controller should be visible.
-  - **`playHook`**: A hook providing the current play amount, play limits, and a function to set the play amount.
-    - **`playLimits`**: Play limits for the game.
-    - **`playAmount`**: The current play amount.
-    - **`setPlayAmount`**: A function to set the play amount.
-  - **`disabledMenu`**: Disable menu flag
-  - **`totalBalance`**: The available balance for the current currency
-
-### 5. `Widgets`
-
-Defines functions for the user actions.
-
-- **`leftWidgets`**: A list of widgets that will be displayed on the left side
-- **`centerWidgets`**: A list of widgets that will be displayed on the center
-- **`rightWidgets`**: A list of widgets that will be displayed on the right side
-
----
-
-## Example Usage
-
-```tsx
-import "@enigma-lake/dice-play-controller-sdk/dist/style.css";
-import { ManualPlayProvider } from "@enigma-lake/dice-play-controller-sdk";
-import { Currency } from "@enigma-lake/zoot-platform-sdk";
-
-const GameExample = () => {
-  const config = {
-    currencyOptions: {
-      currentCurrency: Currency.SWEEPS,
-      currencies: [Currency.SWEEPS, Currency.GOLD],
-      winText: "0.00 SC",
-    },
-    onPlay: () => console.log("Play button clicked"),
-    playOptions: {
-      displayController: true,
-      disabledController: false,
-      disabledMenu: false,
-      playHook: () => {
-        return {
-          playLimits: { min: 1, max: 100 },
-          playAmount: 10,
-          setPlayAmount: (value) => console.log("New play amount:", value),
-        };
-      },
-    },
-    panel: {
-      bottom: window.innerWidth < 450 ? "55px" : "70px",
-      bgColorHex: "#08643F"
-      bgColorOpacity: 0.8,
-    },
-    dropdown: {
-      bgColorHex: "#10243F",
-    }
-  };
-
-  return (
-    <ManualPlayProvider config={config}>
-      {() => (
-        // children content
-      )}
-    </ManualPlayProvider>
-  );
-};
-```
-
----
-
-## Key Features
-
-1. **Dynamic Currency Handling**:
-
-   - Supports multiple currencies (e.g., SWEEPS, GOLD).
-   - Allows users to switch currencies easily.
-
-2. **Play Amount Adjustment**:
-
-   - Includes buttons to halve or double the play amount.
-   - Validates play amounts against user balance and play limits.
-
-3. **Custom Styling**:
-
-   - Supports customizable input and button colors.
-
-4. **Play & Cashout Actions**:
-   - Allows users to initiate gameplay or cash out winnings seamlessly.
-
----
-
-## Development Notes
-
-1. **Play Amount Validation**:
-
-   - The play amount is validated to ensure it falls within the minimum and maximum limits, as well as the user's available balance.
-
-2. **Responsive Design**:
-   - The component is styled to be responsive and integrate seamlessly into various layouts.
+# DicePlayController
+
+The `DicePlayController` component is a key part of the gameplay interface, allowing users to initiate a play or cash out based on their current game state. It supports manual play, dynamic currency handling, and play amount adjustments.
+
+---
+
+## Component Overview
+
+The `DicePlayController` allows the user to:
+
+- Select a currency.
+- Adjust the play amount.
+- Start a play
+
+---
+
+## Setup
+
+### 1. Install the package using npm:
+
+```bash
+npm install @enigma-lake/dice-play-controller-sdk
+```
+
+### 2. Import the component and styles in your project:
+
+```tsx
+import {
+  AUTO_PLAY_STATE,
+  GAME_MODE,
+  ManualPlayProvider,
+} from "@enigma-lake/dice-play-controller-sdk";
+
+import "@enigma-lake/dice-play-controller-sdk/dist/style.css";
+```
+
+---
+
+## Context & Provider
+
+### `ManualPlayProvider`
+
+The `ManualPlayProvider` wraps the DicePlayController, managing both manual play and autoplay. It uses React Context to provide game state and actions throughout the component tree.
+
+🔹 **Features of `ManualPlayProvider`**:
+
+- **Provides Context:** Exposes state and functions for controlling play behavior.
+
+## Props
+
+### 1. `StylingProps`
+
+Handles the styling-related properties for the component.
+
+- **`panel` (optional)**: Custom styling for the play controller.
+
+  - **`bgColorHex`**: Hex color for the panel background.
+  - **`bgColorOpacity` (optional)**: Opacity for the panel background.
+  - **`bottom`**: Position of the panel relative to the window.
+
+- **`dropdown` (optional)**: Custom styling for the dropdown.
+  - **`bgColorHex`**: Hex color for the panel background.
+
+### 2. `CurrencyProps`
+
+Handles currency-related logic and settings.
+
+- **`currencyOptions`**: An object containing the following properties:
+  - **`current`**: The currently selected currency
+  - **`available`**: Array of available currencies that the user can choose from.
+
+### 3. `ActionsProps`
+
+Defines functions for the user actions.
+
+- **`onPlay`**: A callback function to trigger when the user starts a play.
+
+### 4. `PlaySettingsProps`
+
+Handles game-specific settings and states.
+
+- **`playOptions`**: An object containing the following properties:
+
+  - **`disabledController`**: Boolean flag to disable all interactive elements in the component, preventing user interactions (e.g., when the game is in progress).
+  - **`displayController`**: Boolean flag to determine if the play controller should be visible.
+  - **`playHook`**: A hook providing the current play amount, play limits, and a function to set the play amount.
+    - **`playLimits`**: Play limits for the game.
+    - **`playAmount`**: The current play amount.
+    - **`setPlayAmount`**: A function to set the play amount.
+  - **`disabledMenu`**: Disable menu flag
+  - **`totalBalance`**: The available balance for the current currency
+
+### 5. `Widgets`
+
+Defines functions for the user actions.
+
+- **`leftWidgets`**: A list of widgets that will be displayed on the left side
+- **`centerWidgets`**: A list of widgets that will be displayed on the center
+- **`rightWidgets`**: A list of widgets that will be displayed on the right side
+
+---
+
+## Example Usage
+
+```tsx
+import "@enigma-lake/dice-play-controller-sdk/dist/style.css";
+import { ManualPlayProvider } from "@enigma-lake/dice-play-controller-sdk";
+import { Currency } from "@enigma-lake/zoot-platform-sdk";
+
+const GameExample = () => {
+  const config = {
+    currencyOptions: {
+      currentCurrency: Currency.SWEEPS,
+      currencies: [Currency.SWEEPS, Currency.GOLD],
+      winText: "0.00 SC",
+    },
+    onPlay: () => console.log("Play button clicked"),
+    playOptions: {
+      displayController: true,
+      disabledController: false,
+      disabledMenu: false,
+      playHook: () => {
+        return {
+          playLimits: { min: 1, max: 100 },
+          playAmount: 10,
+          setPlayAmount: (value) => console.log("New play amount:", value),
+        };
+      },
+    },
+    panel: {
+      bottom: window.innerWidth < 450 ? "55px" : "70px",
+      bgColorHex: "#08643F"
+      bgColorOpacity: 0.8,
+    },
+    dropdown: {
+      bgColorHex: "#10243F",
+    }
+  };
+
+  return (
+    <ManualPlayProvider config={config}>
+      {() => (
+        // children content
+      )}
+    </ManualPlayProvider>
+  );
+};
+```
+
+---
+
+## Key Features
+
+1. **Dynamic Currency Handling**:
+
+   - Supports multiple currencies (e.g., SWEEPS, GOLD).
+   - Allows users to switch currencies easily.
+
+2. **Play Amount Adjustment**:
+
+   - Includes buttons to halve or double the play amount.
+   - Validates play amounts against user balance and play limits.
+
+3. **Custom Styling**:
+
+   - Supports customizable input and button colors.
+
+4. **Play & Cashout Actions**:
+   - Allows users to initiate gameplay or cash out winnings seamlessly.
+
+---
+
+## Development Notes
+
+1. **Play Amount Validation**:
+
+   - The play amount is validated to ensure it falls within the minimum and maximum limits, as well as the user's available balance.
+
+2. **Responsive Design**:
+   - The component is styled to be responsive and integrate seamlessly into various layouts.

package/dist/components/base/Button/Button.d.ts

@@ -11,7 +11,7 @@ type Props = React.ComponentProps<"button"> & {
     className?: string;
 };
 declare const Button: {
-    ({ disabled, roleType, className, theme, ...props }: Props): React.JSX.Element;
+    ({ disabled, roleType, className, theme, ...props }: Props): import("react/jsx-runtime").JSX.Element;
     themes: {
         primary: string;
         success: string;

package/dist/components/base/ChevronIcon/ChevronIcon.d.ts

@@ -1,5 +1,5 @@
 declare const ChevronIcon: ({ open, disabled, }: {
     open: boolean;
     disabled: boolean;
-}) => import("react").JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default ChevronIcon;

package/dist/components/base/FreeRoundsFooter/FreeRoundsFooter.d.ts

@@ -0,0 +1,2 @@
+declare const FreeRoundsFooter: () => import("react/jsx-runtime").JSX.Element | null;
+export default FreeRoundsFooter;

package/dist/components/base/FreeRoundsFooter/index.d.ts

@@ -0,0 +1,2 @@
+import FreeRoundsFooter from "./FreeRoundsFooter";
+export default FreeRoundsFooter;

package/dist/components/base/FreeRoundsIntroModal/FreeRoundsIntroModal.d.ts

@@ -1,13 +1,14 @@
 export interface FreeRoundsIntroModalProps {
     open: boolean;
     roundsRemaining: number;
-    totalRounds?: number;
+    totalRounds: number;
     stakeCents: number;
     coinType?: number;
     currency?: string;
     decimals?: number;
+    expiresAt?: string | number | Date;
     onPlayNow?: () => void;
     onPlayLater?: () => void;
 }
-declare const FreeRoundsIntroModal: ({ open, roundsRemaining, stakeCents, coinType, currency, decimals, onPlayNow, onPlayLater, }: FreeRoundsIntroModalProps) => import("react").JSX.Element;
+declare const FreeRoundsIntroModal: ({ open, roundsRemaining, totalRounds, stakeCents, coinType, currency, decimals, expiresAt, onPlayNow, onPlayLater, }: FreeRoundsIntroModalProps) => import("react/jsx-runtime").JSX.Element;
 export default FreeRoundsIntroModal;

package/dist/components/base/FreeRoundsSummaryModal/FreeRoundsSummaryModal.d.ts

@@ -0,0 +1,9 @@
+export interface FreeRoundsSummaryModalProps {
+    totalWinAmount: number;
+    coin: string;
+    roundsPlayed: number;
+    decimals?: number;
+    onClose: () => void;
+}
+declare const FreeRoundsSummaryModal: ({ totalWinAmount, coin, roundsPlayed, decimals, onClose, }: FreeRoundsSummaryModalProps) => import("react/jsx-runtime").JSX.Element;
+export default FreeRoundsSummaryModal;

package/dist/components/base/FreeRoundsSummaryModal/index.d.ts

@@ -0,0 +1,3 @@
+import FreeRoundsSummaryModal from "./FreeRoundsSummaryModal";
+export type { FreeRoundsSummaryModalProps } from "./FreeRoundsSummaryModal";
+export default FreeRoundsSummaryModal;

package/dist/components/base/GroupRow/GroupRow.d.ts

@@ -3,5 +3,5 @@ export type Props = ComponentProps<"div"> & {
     label?: string;
     isClassicGame?: boolean;
 };
-declare const GroupRow: ({ children, label, className, isClassicGame, ...restProps }: Props) => import("react").JSX.Element;
+declare const GroupRow: ({ children, label, className, isClassicGame, ...restProps }: Props) => import("react/jsx-runtime").JSX.Element;
 export default GroupRow;

package/dist/components/base/Input/Input.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
 declare const Input: ({ onChange, disabled, className, max, isClassicGame, ...restProps }: React.ComponentProps<"input"> & {
     isClassicGame?: boolean;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default Input;

package/dist/components/base/ManualPlayController/ManualPlayController.d.ts

@@ -1,2 +1,2 @@
-declare const ManualPlayController: () => import("react").JSX.Element;
+declare const ManualPlayController: () => import("react/jsx-runtime").JSX.Element;
 export default ManualPlayController;

package/dist/components/base/PlayController/PlayController.d.ts

@@ -2,5 +2,5 @@ interface PlayAmountControlProps {
     isDisabled: () => boolean;
     lockCurrency?: boolean;
 }
-declare const PlayAmountControl: ({ isDisabled, lockCurrency, }: PlayAmountControlProps) => import("react").JSX.Element;
+declare const PlayAmountControl: ({ isDisabled, lockCurrency, }: PlayAmountControlProps) => import("react/jsx-runtime").JSX.Element;
 export default PlayAmountControl;

package/dist/components/base/PlayValueInput/PlayValueInput.d.ts

@@ -5,5 +5,5 @@ export type Props = PropsWithChildren<ComponentProps<"div">> & {
     value: string;
     isClassicGame?: boolean;
 };
-declare const PlayValueInput: ({ disabled, children, className, value, onClick, isClassicGame, }: Props) => import("react").JSX.Element;
+declare const PlayValueInput: ({ disabled, children, className, value, onClick, isClassicGame, }: Props) => import("react/jsx-runtime").JSX.Element;
 export default PlayValueInput;

package/dist/components/base/PlayValueList/PlayValueList.d.ts

@@ -1,2 +1,2 @@
-declare const PlayValueList: () => import("react").JSX.Element | null;
+declare const PlayValueList: () => import("react/jsx-runtime").JSX.Element | null;
 export default PlayValueList;

package/dist/components/base/SelectMenu/GoldIcon.d.ts

@@ -1 +1 @@
-export declare const GoldIcon: () => import("react").JSX.Element;
+export declare const GoldIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/base/SelectMenu/SelectMenu.d.ts

@@ -1,5 +1,5 @@
 interface ISelectMenuProps {
     disabled?: boolean;
 }
-declare const SelectMenu: ({ disabled }: ISelectMenuProps) => import("react").JSX.Element;
+declare const SelectMenu: ({ disabled }: ISelectMenuProps) => import("react/jsx-runtime").JSX.Element;
 export default SelectMenu;

package/dist/components/base/SelectMenu/SweepsIcon.d.ts

@@ -1 +1 @@
-export declare const SweepsIcon: () => import("react").JSX.Element;
+export declare const SweepsIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/hooks/usePlayController.d.ts

@@ -28,13 +28,11 @@ export declare const usePlayController: () => {
         override_playButtonBackgroundPressed: string | undefined;
     };
     freeRounds: {
-        isAvailable: boolean;
         isEngaged: boolean;
         roundsRemaining: number;
         totalRounds: number;
         stakeCents: number | undefined;
         coinType: number | undefined;
         currency: string | undefined;
-        onUseFreeRounds: (() => void) | undefined;
     };
 };

package/dist/components/utils.d.ts

@@ -3,4 +3,15 @@ export declare const hexToRgb: (hex: string) => string | null;
 export declare const selectButton: (gameMode: GAME_MODE) => HTMLButtonElement;
 export declare const addPressedClass: (gameMode: GAME_MODE, activeClassName: string) => void;
 export declare const removePressedClass: (gameMode: GAME_MODE, activeClassName: string) => void;
+export declare const COIN_TYPE_SWEEPS = 0;
+export declare const COIN_TYPE_GOLD = 1;
+export declare const resolveCoinLabel: ({ coinType, currency, }: {
+    coinType?: number;
+    currency?: string;
+}) => string;
+export declare const resolveCoinDecimals: ({ coinType, currency, fallback, }: {
+    coinType?: number;
+    currency?: string;
+    fallback: number;
+}) => number;
 export declare const format: (value: number | string, decimals: number) => string | number;

package/dist/index.d.ts

@@ -1,6 +1,6 @@
-import * as react from 'react';
 import { ReactNode, ReactElement } from 'react';
 import { CurrencyProps, PlayLimitsV2 } from '@enigma-lake/zoot-platform-sdk';
+import * as react_jsx_runtime from 'react/jsx-runtime';
 
 declare enum GAME_MODE {
     MANUAL = "manual"
@@ -53,14 +53,13 @@ type BonusBuyOptionsProps = {
     override_playButtonBackgroundPressed?: string;
 };
 type FreeRoundsOptionsProps = {
-    available: boolean;
     engaged: boolean;
     roundsRemaining: number;
     totalRounds: number;
     stakeCents: number;
     coinType?: number;
     currency?: string;
-    onUseFreeRounds?: () => void;
+    expiresAt?: string | number | Date;
     showIntroModal?: boolean;
     onPlayNow?: () => void;
     onPlayLater?: () => void;
@@ -103,15 +102,24 @@ declare const ManualPlayProvider: React.FC<ManualPlayStateProviderProps>;
 interface FreeRoundsIntroModalProps {
     open: boolean;
     roundsRemaining: number;
-    totalRounds?: number;
+    totalRounds: number;
     stakeCents: number;
     coinType?: number;
     currency?: string;
     decimals?: number;
+    expiresAt?: string | number | Date;
     onPlayNow?: () => void;
     onPlayLater?: () => void;
 }
-declare const FreeRoundsIntroModal: ({ open, roundsRemaining, stakeCents, coinType, currency, decimals, onPlayNow, onPlayLater, }: FreeRoundsIntroModalProps) => react.JSX.Element;
+declare const FreeRoundsIntroModal: ({ open, roundsRemaining, totalRounds, stakeCents, coinType, currency, decimals, expiresAt, onPlayNow, onPlayLater, }: FreeRoundsIntroModalProps) => react_jsx_runtime.JSX.Element;
+
+interface FreeRoundsSummaryModalProps {
+    totalWinAmount: number;
+    coin: string;
+    roundsPlayed: number;
+    decimals?: number;
+    onClose: () => void;
+}
+declare const FreeRoundsSummaryModal: ({ totalWinAmount, coin, roundsPlayed, decimals, onClose, }: FreeRoundsSummaryModalProps) => react_jsx_runtime.JSX.Element;
 
-export { FreeRoundsIntroModal, GAME_MODE, ManualPlayProvider, WIDGET, format };
-export type { ActionsProps, BonusBuyOptionsProps, ClassicGameProps, FreeRoundsIntroModalProps, FreeRoundsOptionsProps, PlayControllerProps, PlaySettingsProps, StylingProps, Widget };
+export { type ActionsProps, type BonusBuyOptionsProps, type ClassicGameProps, FreeRoundsIntroModal, type FreeRoundsIntroModalProps, type FreeRoundsOptionsProps, FreeRoundsSummaryModal, type FreeRoundsSummaryModalProps, GAME_MODE, ManualPlayProvider, type PlayControllerProps, type PlaySettingsProps, type StylingProps, WIDGET, type Widget, format };