### Install stake-engine with npm or yarn

Source: https://github.com/engineio/ts-client/blob/main/README.md

Install the stake-engine package using either npm or yarn. Choose one command based on your package manager.

```bash
npm install stake-engine

or

yarn add stake-engine
```

--------------------------------

### RGSClient usage example

Source: https://github.com/engineio/ts-client/blob/main/README.md

Shows how to initialize the RGSClient and use its methods: Authenticate, Play, EndRound, Event, and DisplayAmount. The Play method requires an RGS compliant amount (1 * API_MULTIPLIER) or a bet level value. DisplayAmount options include removeSymbol, decimals, and wholeNumberDecimals.

```typescript
import { RGSClient } from 'stake-engine';

const rgsClient = RGSClient({
  url: window.location.href,
});

const handleAuthenticate = async () => {
  const response = await rgsClient.Authenticate();
  return response;
};

const handlePlay = async (amount: number, mode: string) => {
  // ensure amount is RGS compliant amount (1 * API_MULTIPLIER)
  // Or make sure you pass in a bet level value.
  const response = await rgsClient.Play({
    amount,
    mode,
  });

  return response;
};

const handleEndRound = async () => {
  const response = await rgsClient.EndRound();
  return response;
};

const handleEvent = async () => {
  const response = await rgsClient.Event('some_event');
  return response;
};

/*
  Params:
    decimals: Forces a certain number of decimals, otherwise defaults to a reasonable value based on currency.
    removeSymbol: Removes the currency symbol from the string EG CAD$1.99 -> 1.99
    trimDecimalForIntegers: Any number that is a whole number will not display the decimal points. This may help when displaying bet levels. EG 2.00 -> 2
*/
DisplayAmount(balance, {
  removeSymbol: true,
  decimals: 2,
  wholeNumberDecimals: true,
});
```

--------------------------------

### DisplayAmount(val: number): string

Source: https://github.com/engineio/ts-client/blob/main/README.md

Helper function that formats a numeric amount into a displayable string.

```APIDOC
## DisplayAmount(val: number): string

### Description
Formats a numeric amount into a string suitable for display.

### Parameters
- **val** (number) - Required - The numeric amount to format.

### Returns
- **string** - The formatted amount string.
```

--------------------------------

### DisplayBalance(balance: Balance): string

Source: https://github.com/engineio/ts-client/blob/main/README.md

Helper function that formats a Balance object into a displayable string.

```APIDOC
## DisplayBalance(balance: Balance): string

### Description
Formats a Balance object into a string suitable for display.

### Parameters
- **balance** (Balance) - Required - The balance object containing amount and currency.

### Returns
- **string** - The formatted balance string.
```

--------------------------------

### balanceUpdate Event

Source: https://github.com/engineio/ts-client/blob/main/README.md

Listen to this event to update the balance in the UI. It triggers whenever a Balance object is returned from the API.

```APIDOC
## balanceUpdate Event

### Description
Fires whenever a Balance object is returned from the API. Use this to update the balance in the UI.

### Event Detail
- **detail** (Balance) - The balance object with amount and currency.

### Example
```typescript
type Balance = {
  amount: number;
  currency: Currency;
};

window.addEventListener('balanceUpdate', (event: Event) => {
  const customEvent = event as CustomEvent<Balance>;
  console.log('Balance Event', customEvent.detail);
});
```
```

--------------------------------

### Listen to balanceUpdate event

Source: https://github.com/engineio/ts-client/blob/main/README.md

Adds an event listener for the 'balanceUpdate' event, which fires whenever a Balance object is returned from the API. The event detail is a Balance object with amount and currency properties.

```typescript
type Balance = {
  amount: number;
  currency: Currency;
};

window.addEventListener('balanceUpdate', (event: Event) => {
  const customEvent = event as CustomEvent<Balance>;
  console.log('Balance Event', customEvent.detail);
});
```

--------------------------------

### roundActive Event

Source: https://github.com/engineio/ts-client/blob/main/README.md

Listen to this event to know whether to enable or disable UI buttons.

```APIDOC
## roundActive Event

### Description
Fires to indicate whether a round is active, allowing UI buttons to be enabled or disabled accordingly.

### Event Detail
- **detail** (RoundState) - An object with an `active` boolean.

### Example
```typescript
type RoundState = {
  active: boolean;
};

window.addEventListener('roundActive', (event: Event) => {
  const customEvent = event as CustomEvent<RoundState>;
  console.log('Balance Event', customEvent.detail);
});
```
```

--------------------------------

### Svelte component subscribing to balance events

Source: https://github.com/engineio/ts-client/blob/main/README.md

A Svelte component that subscribes to the 'balanceUpdate' event and displays the current balance. It uses onMount to add and remove the event listener, and conditionally renders the balance or a waiting message.

```typescript
<script lang="ts">
  type Balance = {
    amount: number;
    currency: string;
  };

  let balance: Balance | null = null;

  const handleBalanceUpdate = (event: CustomEvent<Balance>) => {
    balance = event.detail;
  };

  // attach listener when component mounts
  onMount(() => {
    window.addEventListener("balanceUpdate", handleBalanceUpdate as EventListener);
    return () => {
      window.removeEventListener("balanceUpdate", handleBalanceUpdate as EventListener);
    };
  });
</script>

<div class="p-4 rounded-2xl shadow bg-white">
  {#if balance}
    <h2 class="text-lg font-semibold">Current Balance</h2>
    <p class="text-xl font-bold">
      {balance.amount} {balance.currency}
    </p>
  {:else}
    <p class="text-gray-500">Waiting for balance update...</p>
  {/if}
</div>
```

--------------------------------

### ParseAmount(val: number): number

Source: https://github.com/engineio/ts-client/blob/main/README.md

Helper function that parses a numeric amount, likely converting from display format to internal representation.

```APIDOC
## ParseAmount(val: number): number

### Description
Parses a numeric amount, converting it to the internal representation.

### Parameters
- **val** (number) - Required - The numeric amount to parse.

### Returns
- **number** - The parsed amount.
```

--------------------------------

### React component subscribing to balance events

Source: https://github.com/engineio/ts-client/blob/main/README.md

A React functional component that subscribes to the 'balanceUpdate' event and displays the current balance. It uses useEffect to add and remove the event listener, and shows a waiting message until a balance is received.

```typescript
import React, { useEffect, useState } from "react";

type Balance = {
  amount: number;
  currency: string;
};

const BalanceDisplay: React.FC = () => {
  const [balance, setBalance] = useState<Balance | null>(null);

  useEffect(() => {
    const handleBalanceUpdate = (event: Event) => {
      const customEvent = event as CustomEvent<Balance>;
      setBalance(customEvent.detail);
    };

    window.addEventListener("balanceUpdate", handleBalanceUpdate);

    return () => {
      window.removeEventListener("balanceUpdate", handleBalanceUpdate);
    };
  }, []);

  if (!balance) {
    return <p className="text-gray-500">Waiting for balance update...</p>;
  }

  return (
    <div className="p-4 rounded-2xl shadow bg-white">
      <h2 className="text-lg font-semibold">Current Balance</h2>
      <p className="text-xl font-bold">

        {balance.amount} {balance.currency}
      </p>
    </div>
  );
};

export default BalanceDisplay;
```

--------------------------------

### Listen to roundActive event

Source: https://github.com/engineio/ts-client/blob/main/README.md

Adds an event listener for the 'roundActive' event to enable or disable UI buttons. The event detail is a RoundState object with an active boolean property.

```typescript
type RoundState = {
  active: boolean;
};

window.addEventListener('roundActive', (event: Event) => {
  const customEvent = event as CustomEvent<RoundState>;
  console.log('Balance Event', customEvent.detail);
});
```

--------------------------------

### API_MULTIPLIER

Source: https://github.com/engineio/ts-client/blob/main/README.md

A constant multiplier used in amount conversions.

```APIDOC
## API_MULTIPLIER

### Description
A constant multiplier used in amount conversions.
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.