Cash Out

Usage

import { CashOut } from '@wdzyi/ui';

<CashOut
  bet={bet}
  value={offer}
  partial
  onCashOut={(amount, share) => cashOut(bet.id, amount, share)}
  onDone={() => closeBet(bet.id)}
/>

Part of @wdzyi/ui. See setup to install it, or copy the code above.

Props

betCashOutBet

The bet: its kind, its legs with how each stands, a note such as the minute and the kits beside them, the stake and the potential return. A sample multi by default.

valuenumber | null = 17.9

What it’s worth to cash out now, driven by you as the game goes. Null while cash out is suspended.

onCashOut(amount: number, share: number) => Promise<void>

Cashes out the amount, and the share of the bet a partial cash out set. Resolve once it’s done, or reject and the card goes back to the bet. Left out, it stands in for 0.8 seconds.

onDone() => void

Called when Done is pressed on the receipt, such as to take the bet off the open ones. Left out, the receipt has no Done.

cashedOutnumber | null

What the bet was cashed out for, when it already has been. Given, the card is its receipt from the start, without counting the amount in.

partialboolean = false

Adds a slider to cash out part of the bet, from 10% to all of it. Its receipt says the rest is still riding, and Back to bet returns to it.

detailsboolean = true

Shows the legs. Off, the card is shorter.

currencystring = 'AUD'

The currency of the stake and amounts, written the Australian way.

classNamestring

Added to the card. It’s 360px wide at most, and narrows with the space it’s in.

Notes

• The value moves on the button itself, rolling the short way on reels with an arrow coming in 4px from the way it went over 320ms, so the amount pressed for is the one in sight. The button is flat, in the one colour a casino game gives its action: a step lighter under the pointer, and a step darker at 0.98 of its size pressed.
• Pressing it locks the amount and cashes out, the pixel loader running for about 0.8 seconds. Then the card becomes its receipt over 420ms: the terms fold away, and a tick and Cashed out rise in over the button as the amount counts in at 48px, or 36px without the legs, on the Money Count the payout pieces share. The legs still open settle with ticks in ink as it counts, 90ms apart, since they were closed rather than won.
• As the count lands, the line under it says what it made, such as +$8.40 on your $10.00 stake, the gain in green. Cashed out for the stake or less, the tick is ink, the line says so plainly, such as $3.80 less than your $10.00 stake, and it lands quietly: never green or a chime for a return that isn’t a gain.
• Each leg has its kit, or both sides’ for a pick on the whole match, and a leg in play has the orange light the casino pieces keep for what’s live, pinging every 2s, as the bet has. The partial slider sets the share in steps of 5%, and the button says that share’s amount.
• It sends a rising run of coin as the amount counts and land as it lands when it’s more than the stake, settle when it isn’t, and error if cashing out fails. The result is announced. With reduced motion, the arrow and the receipt appear in place, the parts of the card change with a fade, the amount is simply there, and the lights hold still.