Skip to content

HoldemPokerTools/HandMatrix

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

84 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

React Texas Hold'em Hand Matrix Component
React Texas Hold'em Hand Matrix Component

Hold'em Poker Tools React hand matrix is a React component to make displaying poker ranges simple!

InstallUsageAPISupportLicense

Install

Install via NPM (or Yarn):

npm i --save @holdem-poker-tools/hand-matrix

Usage

Hand Matrix

const range = ['AA', 'KK', 'QQ', 'AKs', 'AQs'];

<HandMatrix
  colorize={false}
  comboStyle={(combo) => ({
    background: range.indexOf(combo) !== -1 ? "lightgreen" : "lightgrey"
  })}
  comboSubtext={(combo) => range.indexOf(combo) !== -1 ? "100%" : "0%"}
  onSelect={combo => console.log(`selected ${combo}`)}
  onPointerDown={combo => console.log(`pointerDown on ${combo}`)}
  onPointerUp={combo => console.log(`pointerUp on ${combo}`)}
  onPointerEnter={combo => console.log(`pointerEnter on ${combo}`)}
  onPointerMove={combo => console.log(`pointerMove on ${combo}`)}
/>

For an advanced usage example, see the Hold'em Tools Range Assistant web app and associated GitHub repository.

API

Prop Type Default Required Description
colorize Boolean true Whether to apply default colors to the hand matrix to distinguish pairs vs offsuit vs suited hands. The result of the comboStyle function will override these default colors.
comboStyle Function Function which receives the combo (e.g. AKo) and must return an object containing the styles to apply to the matrix tile for that combo e.g. {background: "#FFFFFF"}. Useful for displaying ranges.
showText Boolean true Whether to show the text in the combo cells
comboSubtext Function Function which receives the combo (e.g. AKo) and must return the text or React components to display beneath the combo text. Default is for no text to be displayed. Useful for displaying information such as combo equity
onSelect Function Click event handler for a combo tile. Will be called with combo e.g. AKo
onPointerDown Function Pointer down event handler for a combo tile. Will be called with combo e.g. AKo
onPointerEnter Function Pointer enter event handler for a combo tile. Will be called with combo e.g. AKo
onPointerMove Function Pointer move event handler for a combo tile. Will be called with combo e.g. AKo
onPointerUp Function Pointer up event handler for a combo tile. Will be called with combo e.g. AKo

Support

All Hold'em Poker Tools projects are open source and free to use or extend to your heart's extent. If you'd like to say thanks, feel free to show your support on Buy Me a Coffee:

Buy Me A Coffee

License

MIT